From 0eafb4d3fd0cd7dae8f77878ae44afe4df13eca7 Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Mon, 14 Apr 2025 20:03:17 +0800
Subject: [PATCH 01/20] update flow form

---
 .../flow/nodes/panel/ButtonPanel.tsx          | 200 +++++++++---------
 .../components/flow/nodes/panel/EdgePanel.tsx |   3 +-
 .../components/flow/nodes/panel/NodePanel.tsx |   9 +-
 .../flow/nodes/panel/ScriptModal.tsx          |  58 ++---
 .../components/flow/nodes/panel/circulate.tsx |   8 +-
 .../src/components/flow/nodes/panel/node.tsx  |   8 +-
 .../src/components/flow/nodes/panel/over.tsx  |   8 +-
 .../src/components/flow/nodes/panel/start.tsx |   8 +-
 admin-pro-ui/src/components/flow/types.ts     |   4 +-
 9 files changed, 155 insertions(+), 151 deletions(-)

diff --git a/admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx b/admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx
index d027b993..dfac4cc5 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx
@@ -1,6 +1,6 @@
 import React from "react";
-import {ActionType, ModalForm, ProColumns, ProForm, ProFormText, ProTable} from "@ant-design/pro-components";
-import {Button, ColorPicker, Popconfirm, Space} from "antd";
+import {ActionType, ProColumns, ProTable} from "@ant-design/pro-components";
+import {Button, ColorPicker, Modal, Popconfirm, Space} from "antd";
 import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
 import {EyeOutlined} from "@ant-design/icons";
 import FlowContext from "@/components/flow/domain/FlowContext";
@@ -8,6 +8,7 @@ import FormInput from "@/components/form/input";
 import ValidateUtils from "@/components/form/utils";
 import FormSelect from "@/components/form/select";
 import FormColor from "@/components/form/color";
+import Form from "@/components/form";
 
 interface ButtonPanelProps {
     id: string;
@@ -17,9 +18,8 @@ const ButtonPanel: React.FC<ButtonPanelProps> = (props) => {
 
     const actionRef = React.useRef<ActionType>();
 
-    const [form] = ProForm.useForm();
-    const [groovyForm] = ProForm.useForm();
-
+    const form = Form.useForm();
+    const groovyForm = Form.useForm();
 
     const [visible, setVisible] = React.useState(false);
 
@@ -70,7 +70,7 @@ const ButtonPanel: React.FC<ButtonPanelProps> = (props) => {
                     <a
                         key={"edit"}
                         onClick={() => {
-                            groovyForm.resetFields();
+                            groovyForm.reset();
                             form.setFieldsValue(record);
                             setType(record.type);
                             setVisible(true);
@@ -113,7 +113,7 @@ const ButtonPanel: React.FC<ButtonPanelProps> = (props) => {
                         <Button
                             type={"primary"}
                             onClick={() => {
-                                groovyForm.resetFields();
+                                groovyForm.reset();
                                 setVisible(true);
                             }}
                         >添加按钮</Button>
@@ -121,111 +121,111 @@ const ButtonPanel: React.FC<ButtonPanelProps> = (props) => {
                 }}
             />
 
-            <ModalForm
+            <Modal
                 title={"添加节点按钮"}
                 open={visible}
-                form={form}
-                onFinish={async (values) => {
-                    flowContext.getFlowPanelContext()?.updateButton(props.id, values as any);
+                onCancel={()=>{
                     setVisible(false);
-                    actionRef.current?.reload();
                 }}
-                modalProps={{
-                    onCancel: () => {
-                        setVisible(false);
-                    },
-                    onClose:()=>{
-                        setVisible(false);
-                    },
-                    destroyOnClose:true
+                onClose={()=>{
+                    setVisible(false);
                 }}
+                onOk={async ()=>{
+                    await form.submit();
+                }}
+                destroyOnClose={true}
             >
-                <FormInput
-                    name={"id"}
-                    hidden={true}
-                />
-
-                <ProFormText
-                    name={"name"}
-                    label={"按钮名称"}
-                    placeholder={"请输入按钮名称"}
-                    required={true}
-                    rules={[
-                        {
-                            required: true,
-                            message: '请输入按钮名称',
-                        },
-                    ]}
-                />
-
-                <FormColor
-                    name={["style","background"]}
-                    label={"按钮颜色"}
-                    placeholder={"请输入按钮颜色"}
-                    required={true}
-                    validateFunction={ValidateUtils.validateNotEmpty}
-                />
-
-                <FormSelect
-                    name={"type"}
-                    label={(
-                        <Space>
-                            按钮类型
-
-                            {type === 'CUSTOM' && (
-                                <EyeOutlined
-                                    onClick={() => {
-                                        groovyForm.resetFields();
-                                        const script = form.getFieldValue('groovy') || 'def run(content){\n  //你的代码 \n  return content.createMessageResult(\'我是自定义标题\');\n}';
-                                        groovyForm.setFieldsValue({
-                                            'script': script
-                                        });
-                                        setScriptVisible(!scriptVisible);
-                                    }}/>
-                            )}
-
-                        </Space>
-                    )}
-                    placeholder={"请输入按钮类型"}
-                    required={true}
-                    options={flowContext.getFlowPanelContext()?.getButtonEventOptions()}
-                    onChange={(value: string) => {
-                        setType(value);
+
+                <Form
+                    layout={"vertical"}
+                    form={form}
+                    onFinish={async (values) => {
+                        flowContext.getFlowPanelContext()?.updateButton(props.id, values as any);
+                        setVisible(false);
+                        actionRef.current?.reload();
                     }}
-                />
+                >
+
+                    <FormInput
+                        name={"id"}
+                        hidden={true}
+                    />
 
-                {type === 'VIEW' && (
                     <FormInput
-                        name={"eventKey"}
-                        label={"事件Key"}
-                        help={"事件Key用于流程Form的事件触发"}
+                        name={"name"}
+                        label={"按钮名称"}
+                        placeholder={"请输入按钮名称"}
                         required={true}
+                        validateFunction={ValidateUtils.validateNotEmpty}
                     />
-                )}
-
-                <FormInput
-                    name={"groovy"}
-                    hidden={true}
-                />
-
-                <FormInput
-                    name={"order"}
-                    label={"排序"}
-                    inputType={"number"}
-                    placeholder={"请输入排序"}
-                />
-
-                <ScriptModal
-                    onFinish={(values) => {
-                        form.setFieldsValue({
-                            'groovy': values.script
-                        });
-                    }}
-                    form={groovyForm}
-                    setVisible={setScriptVisible}
-                    visible={scriptVisible}/>
 
-            </ModalForm>
+                    <FormColor
+                        name={["style","background"]}
+                        label={"按钮颜色"}
+                        placeholder={"请输入按钮颜色"}
+                    />
+
+                    <FormSelect
+                        name={"type"}
+                        label={(
+                            <Space>
+                                按钮类型
+
+                                {type === 'CUSTOM' && (
+                                    <EyeOutlined
+                                        onClick={() => {
+                                            groovyForm.reset();
+                                            const script = form.getFieldValue('groovy') || 'def run(content){\n  //你的代码 \n  return content.createMessageResult(\'我是自定义标题\');\n}';
+                                            groovyForm.setFieldsValue({
+                                                'script': script
+                                            });
+                                            setScriptVisible(!scriptVisible);
+                                        }}/>
+                                )}
+
+                            </Space>
+                        )}
+                        placeholder={"请输入按钮类型"}
+                        required={true}
+                        options={flowContext.getFlowPanelContext()?.getButtonEventOptions()}
+                        onChange={(value: string) => {
+                            setType(value);
+                        }}
+                    />
+
+                    {type === 'VIEW' && (
+                        <FormInput
+                            name={"eventKey"}
+                            label={"事件Key"}
+                            help={"事件Key用于流程Form的事件触发"}
+                            required={true}
+                        />
+                    )}
+
+                    <FormInput
+                        name={"groovy"}
+                        hidden={true}
+                    />
+
+                    <FormInput
+                        name={"order"}
+                        label={"排序"}
+                        inputType={"number"}
+                        placeholder={"请输入排序"}
+                    />
+
+                    <ScriptModal
+                        onFinish={(values) => {
+                            form.setFieldsValue({
+                                'groovy': values.script
+                            });
+                        }}
+                        form={groovyForm}
+                        setVisible={setScriptVisible}
+                        visible={scriptVisible}/>
+
+                </Form>
+            </Modal>
         </>
     )
 }
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx b/admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx
index 72cfae8b..553f6342 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx
@@ -4,6 +4,7 @@ import {Input, InputNumber, Popconfirm, Space} from "antd";
 import {CheckOutlined, EditOutlined, SettingOutlined} from "@ant-design/icons";
 import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
 import FlowContext from "@/components/flow/domain/FlowContext";
+import Form from "@/components/form";
 
 interface EdgePanelProps {
     id?: string;
@@ -17,7 +18,7 @@ const EdgePanel: React.FC<EdgePanelProps> = (props) => {
     const [name, setName] = React.useState("");
     const [order, setOrder] = React.useState(0);
 
-    const [groovyForm] = ProForm.useForm();
+    const groovyForm = Form.useForm();
     const actionRef = React.useRef<ActionType>();
 
     const flowContext = FlowContext.getInstance();
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx b/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx
index 90cf2779..0a846722 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import {Button, Divider, Form, Space} from "antd";
+import {Button, Divider, Space} from "antd";
 import {EyeOutlined, SettingOutlined} from "@ant-design/icons";
 import GroovyScript from "@/components/flow/utils/script";
 import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
@@ -7,10 +7,10 @@ import {getComponent} from "@/framework/ComponentBus";
 import ValidateUtils from "@/components/form/utils";
 import FormSelect from "@/components/form/select";
 import FormSwitch from "@/components/form/switch";
-import {ProForm} from "@ant-design/pro-components";
 import FormInput from "@/components/form/input";
-import {FormInstance} from "antd/es/form/hooks/useForm";
 import {UserSelectFormProps, UserSelectFormViewKey} from "@/components/flow/types";
+import FormInstance from "@/components/form/domain/FormInstance";
+import Form from "@/components/form";
 
 interface NodePanelProps {
     id?: string,
@@ -22,7 +22,7 @@ interface NodePanelProps {
 
 const NodePanel: React.FC<NodePanelProps> = (props) => {
 
-    const [groovyForm] = ProForm.useForm();
+    const groovyForm = Form.useForm();
 
     const [visible, setVisible] = React.useState(false);
 
@@ -33,7 +33,6 @@ const NodePanel: React.FC<NodePanelProps> = (props) => {
     // 用户选人视图
     const UserSelectView = getComponent(UserSelectFormViewKey) as React.ComponentType<UserSelectFormProps>;
 
-
     return (
         <>
             <Form
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.tsx b/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.tsx
index da366036..253b2e86 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.tsx
@@ -4,9 +4,10 @@ import {markdown} from "@/components/flow/nodes/panel/help";
 import remarkGfm from 'remark-gfm'
 import FormInput from "@/components/form/input";
 import FormCode from "@/components/form/code";
-import {ModalForm} from "@ant-design/pro-components";
-import {FormInstance} from "antd/es/form/hooks/useForm";
 import "./ScriptModal.scss";
+import FormInstance from "@/components/form/domain/FormInstance";
+import {Modal} from "antd";
+import Form from "@/components/form";
 
 interface ScriptModalProps {
     form: FormInstance;
@@ -16,39 +17,41 @@ interface ScriptModalProps {
 }
 
 const ScriptModal: React.FC<ScriptModalProps> = (props) => {
-
     return (
-        <ModalForm
-            form={props.form}
+        <Modal
             width={"85vw"}
             className={"flow-script-modal"}
             title={"脚本预览"}
             open={props.visible}
-            modalProps={{
-                onCancel: () => {
-                    props.setVisible(false);
-                },
-                onClose: () => {
-                    props.setVisible(false);
-                },
-                destroyOnClose: true
+            onCancel={() => {
+                props.setVisible(false);
             }}
-            onFinish={async (values) => {
-                props.onFinish(values);
+            onClose={() => {
                 props.setVisible(false);
             }}
+            onOk={async ()=>{
+                await props.form.submit();
+            }}
+            destroyOnClose={true}
         >
-            <div className={"flow-script-content"}>
-                <div className={"flow-script-help"}>
-                    <div className={"flow-script-help-markdown"}>
-                        <Markdown
-                            remarkPlugins={[remarkGfm]}
-                        >
-                            {markdown}
-                        </Markdown>
+            <Form
+                form={props.form}
+                onFinish={async (values) => {
+                    props.onFinish(values);
+                    props.setVisible(false);
+                }}
+            >
+                <div className={"flow-script-content"}>
+                    <div className={"flow-script-help"}>
+                        <div className={"flow-script-help-markdown"}>
+                            <Markdown
+                                remarkPlugins={[remarkGfm]}
+                            >
+                                {markdown}
+                            </Markdown>
+                        </div>
                     </div>
-                </div>
-                <div className={"flow-script-form"}>
+                    <div className={"flow-script-form"}>
                         <FormInput
                             name={"type"}
                             hidden={true}
@@ -60,9 +63,10 @@ const ScriptModal: React.FC<ScriptModalProps> = (props) => {
                                 height: '65vh',
                             }}
                         />
+                    </div>
                 </div>
-            </div>
-        </ModalForm>
+            </Form>
+        </Modal>
     )
 }
 
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/circulate.tsx b/admin-pro-ui/src/components/flow/nodes/panel/circulate.tsx
index 5e79774d..ff135049 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/circulate.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/circulate.tsx
@@ -3,11 +3,11 @@ import {Button, Drawer, Space, Tabs} from "antd";
 import NodePanel from "@/components/flow/nodes/panel/NodePanel";
 import EdgePanel from "@/components/flow/nodes/panel/EdgePanel";
 import {SettingPanelProps} from "@/components/flow/types";
-import {ProForm} from "@ant-design/pro-components";
+import Form from "@/components/form";
 
 const CirculateSettingPanel: React.FC<SettingPanelProps> = (props) => {
 
-    const [form] = ProForm.useForm();
+    const form = Form.useForm();
 
     return (
         <Drawer
@@ -22,8 +22,8 @@ const CirculateSettingPanel: React.FC<SettingPanelProps> = (props) => {
                 <Space>
                     <Button
                         type={"primary"}
-                        onClick={() => {
-                            form.submit();
+                        onClick={async () => {
+                            await form.submit();
                             props.setVisible(false);
                         }}
                     >确认</Button>
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/node.tsx b/admin-pro-ui/src/components/flow/nodes/panel/node.tsx
index 27705a91..06358d54 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/node.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/node.tsx
@@ -4,12 +4,12 @@ import NodePanel from "@/components/flow/nodes/panel/NodePanel";
 import EdgePanel from "@/components/flow/nodes/panel/EdgePanel";
 import ButtonPanel from "@/components/flow/nodes/panel/ButtonPanel";
 import {SettingPanelProps} from "@/components/flow/types";
-import {ProForm} from "@ant-design/pro-components";
+import Form from "@/components/form";
 
 
 const NodeSettingPanel: React.FC<SettingPanelProps> = (props) => {
 
-    const [form] = ProForm.useForm();
+    const form = Form.useForm();
 
     return (
         <Drawer
@@ -24,8 +24,8 @@ const NodeSettingPanel: React.FC<SettingPanelProps> = (props) => {
                 <Space>
                     <Button
                         type={"primary"}
-                        onClick={() => {
-                            form.submit();
+                        onClick={async () => {
+                            await form.submit();
                             props.setVisible(false);
                         }}
                     >确认</Button>
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/over.tsx b/admin-pro-ui/src/components/flow/nodes/panel/over.tsx
index 7b06d57d..4eda3772 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/over.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/over.tsx
@@ -2,11 +2,11 @@ import React from "react";
 import {Button, Drawer, Space} from "antd";
 import NodePanel from "@/components/flow/nodes/panel/NodePanel";
 import {SettingPanelProps} from "@/components/flow/types";
-import {ProForm} from "@ant-design/pro-components";
+import Form from "@/components/form";
 
 const OverSettingPanel: React.FC<SettingPanelProps> = (props) => {
 
-    const [form] = ProForm.useForm();
+    const form = Form.useForm();
 
     return (
         <Drawer
@@ -21,8 +21,8 @@ const OverSettingPanel: React.FC<SettingPanelProps> = (props) => {
                 <Space>
                     <Button
                         type={"primary"}
-                        onClick={() => {
-                            form.submit();
+                        onClick={async () => {
+                            await form.submit();
                             props.setVisible(false);
                         }}
                     >确认</Button>
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/start.tsx b/admin-pro-ui/src/components/flow/nodes/panel/start.tsx
index ddc76c8d..2fa1a79c 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/start.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/start.tsx
@@ -2,13 +2,13 @@ import React from "react";
 import {Button, Drawer, Space, Tabs} from "antd";
 import EdgePanel from "@/components/flow/nodes/panel/EdgePanel";
 import NodePanel from "@/components/flow/nodes/panel/NodePanel";
-import {ProForm} from "@ant-design/pro-components";
 import ButtonPanel from "@/components/flow/nodes/panel/ButtonPanel";
 import {SettingPanelProps} from "@/components/flow/types";
+import Form from "@/components/form";
 
 const StartSettingPanel: React.FC<SettingPanelProps> = (props) => {
 
-    const [form] = ProForm.useForm();
+    const form = Form.useForm();
 
     return (
         <Drawer
@@ -23,8 +23,8 @@ const StartSettingPanel: React.FC<SettingPanelProps> = (props) => {
                 <Space>
                     <Button
                         type={"primary"}
-                        onClick={() => {
-                            form.submit();
+                        onClick={async () => {
+                            await form.submit();
                             props.setVisible(false);
                         }}
                     >确认</Button>
diff --git a/admin-pro-ui/src/components/flow/types.ts b/admin-pro-ui/src/components/flow/types.ts
index 18f34b25..d91b90c6 100644
--- a/admin-pro-ui/src/components/flow/types.ts
+++ b/admin-pro-ui/src/components/flow/types.ts
@@ -1,5 +1,5 @@
 // 节点状态
-import {FormAction} from "@/components/form";
+import FormInstance from "@/components/form/domain/FormInstance";
 
 export type NodeState = "done" | "wait" | "undone" | "current";
 
@@ -122,7 +122,7 @@ export interface FlowFormViewProps {
     // 表单数据
     data: FlowFormParams;
     // 表单控制对象
-    formAction: React.RefObject<FormAction>;
+    formInstance: FormInstance;
     // 数据版本
     dataVersion?: number;
 }

From 06050c21624ea34b5bb0913c6d6b491f3f036895 Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Mon, 14 Apr 2025 20:18:20 +0800
Subject: [PATCH 02/20] update flow form

---
 .../src/pages/flow/leave/LeaveForm.tsx        |  47 +++----
 admin-pro-ui/src/pages/flow/user/index.tsx    | 122 ++++++++--------
 admin-pro-ui/src/pages/flow/work/index.tsx    | 130 ++++++++----------
 .../app/cmd/domain/router/UserRouter.java     |   4 +-
 .../domain/user/service/UserService.java      |   6 +-
 .../api/domain/UserDomainCmdController.java   |   2 +-
 6 files changed, 141 insertions(+), 170 deletions(-)

diff --git a/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx b/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
index d4af68af..1602ea71 100644
--- a/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
+++ b/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
@@ -1,52 +1,47 @@
-import React from "react";
-import {ProForm, ProFormDigit, ProFormText, ProFormTextArea} from "@ant-design/pro-components";
+import React, {useEffect} from "react";
 import {FlowFormViewProps} from "@/components/flow/types";
-
+import Form from "@/components/form";
+import FormInput from "@/components/form/input";
+import ValidateUtils from "@/components/form/utils";
+import FormTextArea from "@/components/form/textarea";
 
 const LeaveForm: React.FC<FlowFormViewProps> = (props) => {
 
+    useEffect(() => {
+        props.formInstance.setFieldsValue(props.data)
+    }, [props.dataVersion]);
+
     return (
-        <ProForm
-            submitter={false}
+        <Form
+            form={props.formInstance}
         >
 
-            <ProFormText
+            <FormInput
                 name={"id"}
                 hidden={true}
             />
 
-            <ProFormText
+            <FormInput
                 name={"username"}
                 hidden={true}
             />
 
-            <ProFormDigit
+            <FormInput
                 name={"days"}
                 label={"请假天数"}
-                fieldProps={{
-                    step: 1
-                }}
-                rules={[
-                    {
-                        required: true,
-                        message: "请输入请假天数"
-                    }
-                ]}
+               inputType={"number"}
+               required={true}
+                validateFunction={ValidateUtils.validateNotEmpty}
             />
 
-            <ProFormTextArea
+            <FormTextArea
                 name={"desc"}
                 label={"请假原因"}
-                rules={[
-                    {
-                        required: true,
-                        message: "请输入请假原因"
-                    }
-                ]}
+                required={true}
+                validateFunction={ValidateUtils.validateNotEmpty}
             />
 
-
-        </ProForm>
+        </Form>
     )
 }
 
diff --git a/admin-pro-ui/src/pages/flow/user/index.tsx b/admin-pro-ui/src/pages/flow/user/index.tsx
index f1c99fb3..885c102d 100644
--- a/admin-pro-ui/src/pages/flow/user/index.tsx
+++ b/admin-pro-ui/src/pages/flow/user/index.tsx
@@ -1,18 +1,13 @@
 import React, {useRef} from "react";
-import {
-    ActionType,
-    ModalForm,
-    PageContainer,
-    ProForm,
-    ProFormSwitch,
-    ProFormText,
-    ProTable
-} from "@ant-design/pro-components";
+import {ActionType, PageContainer, ProTable} from "@ant-design/pro-components";
 import {changeManager, entrust, list, remove, removeEntrust, save} from "@/api/user";
-import {Button, message, Popconfirm, Space} from "antd";
+import {Button, message, Modal, Popconfirm, Space} from "antd";
 import {DeleteOutlined, SettingOutlined} from "@ant-design/icons";
 import UserSelect from "@/pages/flow/user/select";
-
+import Form from "@/components/form";
+import FormInput from "@/components/form/input";
+import ValidateUtils from "@/components/form/utils";
+import FormSwitch from "@/components/form/switch";
 
 const UserPage = () => {
 
@@ -22,7 +17,7 @@ const UserPage = () => {
     const [user, setUser] = React.useState<any>({});
 
     const actionRef = useRef<ActionType>();
-    const [form] = ProForm.useForm();
+    const form = Form.useForm();
 
     const handleSave = (values: any) => {
         save(values).then(res => {
@@ -186,67 +181,58 @@ const UserPage = () => {
                     }}
                 />
 
-                <ModalForm
-                    form={form}
+                <Modal
                     title={"编辑用户"}
                     open={visible}
-                    modalProps={{
-                        onCancel: () => {
-                            setVisible(false);
-                        },
-                        onClose: () => {
-                            setVisible(false);
-                        },
-                        destroyOnClose: true
+                    onClose={()=>{
+                        setVisible(false);
+                    }}
+                    onCancel={()=>{
+                        setVisible(false);
                     }}
-                    onFinish={async (values) => {
-                        handleSave(values);
+                    onOk={async ()=>{
+                        await form.submit();
                     }}
                 >
-                    <ProFormText
-                        name={"id"}
-                        hidden={true}
-                    />
-
-                    <ProFormText
-                        name={"name"}
-                        label={"姓名"}
-                        rules={[
-                            {
-                                required: true,
-                                message: "请输入姓名"
-                            }
-                        ]}
-                    />
-
-                    <ProFormText
-                        name={"username"}
-                        label={"登录账号"}
-                        rules={[
-                            {
-                                required: true,
-                                message: "请输入登录账号"
-                            }
-                        ]}
-                    />
-
-                    <ProFormText
-                        name={"password"}
-                        label={"登录密码"}
-                        rules={[
-                            {
-                                required: true,
-                                message: "请输入登录密码"
-                            }
-                        ]}
-                    />
-
-                    <ProFormSwitch
-                        name={"flowManager"}
-                        label={"是否流程管理员"}
-                    />
-
-                </ModalForm>
+                    <Form
+                        layout={"vertical"}
+                        form={form}
+                        onFinish={async (values) => {
+                            handleSave(values);
+                        }}
+                    >
+                        <FormInput
+                            name={"id"}
+                            hidden={true}
+                        />
+
+                        <FormInput
+                            name={"name"}
+                            label={"姓名"}
+                            required={true}
+                            validateFunction={ValidateUtils.validateNotEmpty}
+                        />
+
+                        <FormInput
+                            name={"username"}
+                            label={"登录账号"}
+                            required={true}
+                            validateFunction={ValidateUtils.validateNotEmpty}
+                        />
+
+                        <FormInput
+                            name={"password"}
+                            label={"登录密码"}
+                            required={true}
+                            validateFunction={ValidateUtils.validateNotEmpty}
+                        />
+
+                        <FormSwitch
+                            name={"flowManager"}
+                            label={"是否流程管理员"}
+                        />
+                    </Form>
+                </Modal>
 
                 <UserSelect
                     multiple={false}
diff --git a/admin-pro-ui/src/pages/flow/work/index.tsx b/admin-pro-ui/src/pages/flow/work/index.tsx
index a0431aae..e0915f37 100644
--- a/admin-pro-ui/src/pages/flow/work/index.tsx
+++ b/admin-pro-ui/src/pages/flow/work/index.tsx
@@ -1,23 +1,20 @@
 import React from "react";
 import Flow, {FlowActionType} from "@/components/flow";
-import {
-    ActionType,
-    ModalForm,
-    PageContainer,
-    ProForm,
-    ProFormDigit, ProFormSwitch,
-    ProFormText, ProFormTextArea,
-    ProTable
-} from "@ant-design/pro-components";
+import {ActionType, PageContainer, ProTable} from "@ant-design/pro-components";
 import {changeState, copy, list, remove, save, schema} from "@/api/flow";
-import {Button, Drawer, message, Popconfirm, Space} from "antd";
+import {Button, Drawer, message, Modal, Popconfirm, Space} from "antd";
+import Form from "@/components/form";
+import FormInput from "@/components/form/input";
+import ValidateUtils from "@/components/form/utils";
+import FormTextArea from "@/components/form/textarea";
+import FormSwitch from "@/components/form/switch";
 
 const FlowPage = () => {
 
     const [visible, setVisible] = React.useState(false);
     const [editorVisible, setEditorVisible] = React.useState(false);
     const flowActionType = React.useRef<FlowActionType>(null);
-    const [form] = ProForm.useForm();
+    const form = Form.useForm();
     const actionRef = React.useRef<ActionType>();
 
     const [current, setCurrent] = React.useState<any>(null);
@@ -181,7 +178,7 @@ const FlowPage = () => {
                             data-testid={"flow-add-btn"}
                             type={"primary"}
                             onClick={() => {
-                                form.resetFields();
+                                form.reset();
                                 setEditorVisible(true);
                             }}
                         >新增</Button>
@@ -197,77 +194,68 @@ const FlowPage = () => {
                 }}
             />
 
-            <ModalForm
+            <Modal
                 data-testid={"flow-editor"}
                 title="编辑流程"
-                form={form}
                 open={editorVisible}
-                modalProps={{
-                    destroyOnClose: true,
-                    onClose: () => setEditorVisible(false),
-                    onCancel: () => setEditorVisible(false),
+                destroyOnClose={true}
+                onClose={()=>{
+                    setEditorVisible(false)
+                }}
+                onCancel={()=>{
+                    setEditorVisible(false)
                 }}
-                submitter={{
-                    submitButtonProps:{
-                        "data-testid":"flow-editor-submit",
-                    },
+                onOk={async ()=>{
+                    await form.submit();
                 }}
-                onFinish={handlerSave}
             >
-                <ProFormText
-                    name={"id"}
-                    hidden={true}
-                />
 
-                <ProFormText
-                    name={"title"}
-                    label={"标题"}
-                    rules={[
-                        {
-                            required: true,
-                            message: "请输入标题"
-                        }
-                    ]}
-                />
+                <Form
+                    form={form}
+                    layout={"vertical"}
+                    onFinish={handlerSave}
+                >
+                    <FormInput
+                        name={"id"}
+                        hidden={true}
+                    />
 
-                <ProFormText
-                    name={"code"}
-                    label={"编码"}
-                    rules={[
-                        {
-                            required: true,
-                            message: "请输入编码"
-                        }
-                    ]}
-                />
+                    <FormInput
+                        name={"title"}
+                        label={"标题"}
+                        required={true}
+                        validateFunction={ValidateUtils.validateNotEmpty}
+                    />
 
-                <ProFormTextArea
-                    name={"description"}
-                    label={"描述"}
-                />
+                    <FormInput
+                        name={"code"}
+                        label={"编码"}
+                        required={true}
+                        validateFunction={ValidateUtils.validateNotEmpty}
+                    />
 
-                <ProFormDigit
-                    name={"postponedMax"}
-                    tooltip={"允许流程最大的延期次数"}
-                    label={"最大延期次数"}
-                    fieldProps={{
-                        step:1
-                    }}
-                    rules={[
-                        {
-                            required:true,
-                            message:'最大延期次数不能为空'
-                        }
-                    ]}
-                />
+                    <FormTextArea
+                        name={"description"}
+                        label={"描述"}
+                    />
 
-                <ProFormSwitch
-                    name={"skipIfSameApprover"}
-                    tooltip={"是否跳过相同审批人，默认为否"}
-                    label={"是否跳过相同审批人"}
-                />
+                    <FormInput
+                        name={"postponedMax"}
+                        tooltip={"允许流程最大的延期次数"}
+                        label={"最大延期次数"}
+                        inputType={'number'}
+                        required={true}
+                        validateFunction={ValidateUtils.validateNotEmpty}
+                    />
+
+                    <FormSwitch
+                        name={"skipIfSameApprover"}
+                        tooltip={"是否跳过相同审批人，默认为否"}
+                        label={"是否跳过相同审批人"}
+                    />
+                </Form>
 
-            </ModalForm>
+            </Modal>
 
 
             <Drawer
diff --git a/example/example-app/example-app-cmd-domain/src/main/java/com/codingapi/example/app/cmd/domain/router/UserRouter.java b/example/example-app/example-app-cmd-domain/src/main/java/com/codingapi/example/app/cmd/domain/router/UserRouter.java
index 1b4fccd0..88083da0 100644
--- a/example/example-app/example-app-cmd-domain/src/main/java/com/codingapi/example/app/cmd/domain/router/UserRouter.java
+++ b/example/example-app/example-app-cmd-domain/src/main/java/com/codingapi/example/app/cmd/domain/router/UserRouter.java
@@ -13,9 +13,9 @@ public class UserRouter {
 
     public void createOrUpdate(UserCmd.UpdateRequest request) {
         if (request.hasId()) {
-            userService.update(request.getId(), request.toMetric());
+            userService.update(request.getId(), request.toMetric(),request.isFlowManager());
         } else {
-            userService.create(request.toMetric());
+            userService.create(request.toMetric(),request.isFlowManager());
         }
     }
 
diff --git a/example/example-domain/example-domain-user/src/main/java/com/codingapi/example/domain/user/service/UserService.java b/example/example-domain/example-domain-user/src/main/java/com/codingapi/example/domain/user/service/UserService.java
index b67cdb48..2c286594 100644
--- a/example/example-domain/example-domain-user/src/main/java/com/codingapi/example/domain/user/service/UserService.java
+++ b/example/example-domain/example-domain-user/src/main/java/com/codingapi/example/domain/user/service/UserService.java
@@ -22,16 +22,18 @@ public void initAdmin() {
         }
     }
 
-    public void create(UserMetric userMetric) {
+    public void create(UserMetric userMetric,boolean isFlowManager) {
         User user = new User();
+        user.setFlowManager(isFlowManager);
         user.setUserMetric(userMetric);
         user.encodePassword(passwordEncoder);
         userRepository.save(user);
     }
 
 
-    public void update(long id, UserMetric metric) {
+    public void update(long id, UserMetric metric,boolean isFlowManager) {
         User user = userRepository.getUserById(id);
+        user.setFlowManager(isFlowManager);
         user.setUserMetric(metric);
         user.encodePassword(passwordEncoder);
         userRepository.save(user);
diff --git a/example/example-interface/src/main/java/com/codingapi/example/api/domain/UserDomainCmdController.java b/example/example-interface/src/main/java/com/codingapi/example/api/domain/UserDomainCmdController.java
index 7863f88f..15ecfe1d 100644
--- a/example/example-interface/src/main/java/com/codingapi/example/api/domain/UserDomainCmdController.java
+++ b/example/example-interface/src/main/java/com/codingapi/example/api/domain/UserDomainCmdController.java
@@ -11,7 +11,7 @@
 import org.springframework.web.bind.annotation.RestController;
 
 @RestController
-@RequestMapping("/api/cmd/domain/user")
+@RequestMapping("/api/cmd/user")
 @AllArgsConstructor
 public class UserDomainCmdController {
 

From 2a4f882d49c7884c257be6ff450d7033e77938a3 Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Tue, 15 Apr 2025 08:49:45 +0800
Subject: [PATCH 03/20] add flow page

---
 .../components/flow/components/FlowPage.tsx   |  17 +
 .../flow/domain/FlowButtonClickContext.ts     | 316 ++++++++++++++++
 .../flow/domain/FlowEventContext.ts           | 348 ++++++++++++++++++
 .../flow/domain/FlowPanelContext.ts           |   4 +-
 .../flow/domain/FlowRecordContext.ts          | 205 +++++++++++
 .../flow/domain/FlowResultParser.ts           |  92 +++++
 .../flow/domain/FlowStateContext.tsx          |  95 +++++
 .../flow/domain/FlowTriggerContext.ts         |  32 ++
 .../src/components/flow/store/FlowSlice.ts    | 100 ++++-
 admin-pro-ui/src/components/flow/types.ts     |  38 +-
 .../components/flow/view/FlowModelView.scss   |   1 +
 .../src/components/flow/view/index.scss       |   9 +
 .../src/components/flow/view/index.tsx        | 103 +++++-
 13 files changed, 1348 insertions(+), 12 deletions(-)
 create mode 100644 admin-pro-ui/src/components/flow/components/FlowPage.tsx
 create mode 100644 admin-pro-ui/src/components/flow/domain/FlowButtonClickContext.ts
 create mode 100644 admin-pro-ui/src/components/flow/domain/FlowEventContext.ts
 create mode 100644 admin-pro-ui/src/components/flow/domain/FlowRecordContext.ts
 create mode 100644 admin-pro-ui/src/components/flow/domain/FlowResultParser.ts
 create mode 100644 admin-pro-ui/src/components/flow/domain/FlowStateContext.tsx
 create mode 100644 admin-pro-ui/src/components/flow/domain/FlowTriggerContext.ts
 create mode 100644 admin-pro-ui/src/components/flow/view/index.scss

diff --git a/admin-pro-ui/src/components/flow/components/FlowPage.tsx b/admin-pro-ui/src/components/flow/components/FlowPage.tsx
new file mode 100644
index 00000000..4b50caf6
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/components/FlowPage.tsx
@@ -0,0 +1,17 @@
+import React from "react";
+import {FlowViewProps} from "@/components/flow/types";
+
+
+interface FlowPageProps extends FlowViewProps {
+    // 流程详情数据
+    flowData: any;
+}
+
+
+const FlowPage:React.FC<FlowPageProps> = (props)=>{
+    return (
+        <></>
+    )
+}
+
+export default FlowPage;
diff --git a/admin-pro-ui/src/components/flow/domain/FlowButtonClickContext.ts b/admin-pro-ui/src/components/flow/domain/FlowButtonClickContext.ts
new file mode 100644
index 00000000..d1fd38ba
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/domain/FlowButtonClickContext.ts
@@ -0,0 +1,316 @@
+import {FlowButton} from "@/components/flow/types";
+import {FlowSubmitResultParser, FlowTrySubmitResultParser} from "@/components/flow/domain/FlowResultParser";
+import {FlowEventContext} from "@/components/flow/domain/FlowEventContext";
+import {FlowStateContext} from "./FlowStateContext";
+import {message} from "antd";
+
+// 流程按钮事件点击触发器
+export class FlowButtonClickContext {
+
+    private readonly flowEventContext: FlowEventContext;
+    private readonly flowStateContext: FlowStateContext;
+
+    constructor(flowEventContext: FlowEventContext,
+                flowStateContext: FlowStateContext) {
+        this.flowEventContext = flowEventContext;
+        this.flowStateContext = flowStateContext;
+    }
+
+
+    /**
+     * 触发刷新动作
+     */
+    handlerReload(){
+        this.flowEventContext?.reloadFlow();
+    }
+
+    /**
+     * 触发保存动作
+     */
+    handlerSave(){
+        if (this.flowStateContext?.hasRecordId()) {
+            this.flowEventContext?.saveFlow(() => {
+                message.info('流程保存成功').then();
+            })
+        } else {
+            this.flowEventContext?.startFlow(() => {
+                this.flowEventContext?.saveFlow(() => {
+                    message.info('流程保存成功').then();
+                })
+            });
+        }
+    }
+
+    /**
+     * 触发发起动作
+     */
+    handlerStart(){
+        if (this.flowStateContext?.hasRecordId()) {
+            message.info('流程已发起，无需重复发起').then();
+        } else {
+            this.flowEventContext?.startFlow((res) => {
+                message.info('流程发起成功.').then();
+            })
+        }
+    }
+
+    /**
+     * 指定人提交流程
+     * @param approvalState 审批状态 同意为true 驳回为false
+     * @param operatorIds 流程操作人员id
+     */
+    handlerSpecifyOperatorSubmit(approvalState:boolean,operatorIds:number[]){
+        this.flowEventContext?.submitFlow(true, (res) => {
+            const flowSubmitResultParser = new FlowSubmitResultParser(res.data);
+            this.flowStateContext.setResult(flowSubmitResultParser.parser());
+        }, operatorIds);
+    }
+
+    /**
+     * 触发指定人提交动作
+     */
+    handlerSpecifySubmit(){
+        const trySpecifySubmitHandler = ()=>{
+            this.flowEventContext?.trySubmitFlow((res) => {
+                const operators = res.data.operators;
+                const userIds = operators.map((item: any) => {
+                    return item.userId;
+                });
+                this.flowStateContext?.setUserSelectMode({
+                    userSelectType: 'nextNodeUser',
+                    multiple: true,
+                    specifyUserIds: userIds,
+                });
+            });
+        }
+        if (this.flowStateContext?.hasRecordId()) {
+            trySpecifySubmitHandler();
+        }else {
+            this.flowEventContext?.startFlow(() => {
+                trySpecifySubmitHandler();
+            });
+        }
+    }
+
+    /**
+     * 触发提交动作
+     */
+    handlerSubmit(){
+        const submitHandler = ()=>{
+            this.flowEventContext?.submitFlow(true, (res) => {
+                const flowSubmitResultParser = new FlowSubmitResultParser(res.data);
+                this.flowStateContext?.setResult(flowSubmitResultParser.parser());
+            })
+        }
+        if (this.flowStateContext?.hasRecordId()) {
+            submitHandler();
+        } else {
+            this.flowEventContext?.startFlow(() => {
+                submitHandler();
+            });
+        }
+    }
+
+    /**
+     * 触发驳回动作
+     */
+    handlerReject(){
+        if (this.flowStateContext?.hasRecordId()) {
+            this.flowEventContext?.submitFlow(false, (res) => {
+                const flowSubmitResultParser = new FlowSubmitResultParser(res.data);
+                this.flowStateContext?.setResult(flowSubmitResultParser.parser());
+            })
+        } else {
+            message.info('流程尚未发起，无法操作').then();
+        }
+    }
+
+    /**
+     * 触发尝试提交动作
+     */
+    handlerTrySubmit(){
+        const trySubmitHandler = ()=>{
+            this.flowEventContext?.trySubmitFlow((res) => {
+                const flowTrySubmitResultParser = new FlowTrySubmitResultParser(res.data);
+                this.flowStateContext?.setResult(flowTrySubmitResultParser.parser());
+            });
+        }
+        if (this.flowStateContext?.hasRecordId()) {
+            trySubmitHandler();
+        }else {
+            this.flowEventContext?.startFlow(() => {
+                trySubmitHandler();
+            });
+        }
+    }
+
+    /**
+     * 触发撤回动作
+     */
+    handlerRecall(){
+        this.flowEventContext?.recallFlow(() => {
+            this.flowStateContext?.setResult({
+                state: 'success',
+                closeable: true,
+                title: '流程撤回成功',
+            });
+        });
+    }
+
+    /**
+     * 触发删除动作
+     */
+    handlerRemove(){
+        if (this.flowStateContext?.hasRecordId()) {
+            this.flowEventContext?.removeFlow(() => {
+                this.flowStateContext?.setResult({
+                    state: 'success',
+                    closeable: true,
+                    title: '流程删除成功',
+                });
+            });
+        } else {
+            message.info('流程尚未发起，无法删除').then();
+        }
+    }
+
+    /**
+     * 触发催办动作
+     */
+    handlerUrge(){
+        this.flowEventContext?.urgeFlow(() => {
+            this.flowStateContext?.setResult({
+                state: 'success',
+                closeable: true,
+                title: '催办提醒已发送',
+            });
+        });
+    }
+
+    /**
+     * 触发延期动作
+     */
+    handlerPostponed(){
+        if (this.flowStateContext?.hasRecordId()) {
+            this.flowStateContext?.setPostponedVisible(true);
+        }else {
+            message.info('流程尚未发起，无法操作').then();
+        }
+    }
+
+    /**
+     * 触发转办动作
+     */
+    handlerTransfer(){
+        if (this.flowStateContext?.hasRecordId()) {
+            this.flowStateContext?.setUserSelectMode({
+                userSelectType: 'transfer',
+                multiple: false,
+            });
+        }else {
+            message.info('流程尚未发起，无法操作').then();
+        }
+    }
+
+    /**
+     * 触发自定义接口动作
+     * @param buttonId 自定义按钮的id
+     */
+    handlerCustom(buttonId:string){
+        const customHandler = ()=>{
+            this.flowEventContext?.customFlow(buttonId, (res) => {
+                const customMessage = res.data;
+                this.flowStateContext?.setResult({
+                    state: customMessage.resultState.toLowerCase(),
+                    ...customMessage
+                });
+            });
+        }
+        if (this.flowStateContext?.hasRecordId()) {
+            customHandler();
+        } else {
+            this.flowEventContext?.startFlow((res) => {
+                customHandler();
+            });
+        }
+    }
+
+    /**
+     * 触发自定义前端动作
+     * @param eventKey 自定义按钮的事件key
+     */
+    handlerView(eventKey:string){
+        const viewHandler = ()=>{
+            this.flowEventContext?.triggerEvent(eventKey);
+        }
+
+        if (this.flowStateContext?.hasRecordId()) {
+            viewHandler();
+        }else {
+            this.flowEventContext?.startFlow((res) => {
+                viewHandler();
+            });
+        }
+    }
+
+    /**
+     * 处理按钮点击事件
+     * @param button
+     */
+    handlerClick(button: FlowButton) {
+        if (button.type === "RELOAD") {
+            this.handlerReload();
+        }
+
+        if (button.type === 'SAVE') {
+            this.handlerSave();
+        }
+
+        if (button.type === "START") {
+            this.handlerStart();
+        }
+        if (button.type === 'SPECIFY_SUBMIT') {
+            this.handlerSpecifySubmit();
+        }
+
+        if (button.type === 'SUBMIT') {
+            this.handlerSubmit();
+        }
+
+        if (button.type === 'REJECT') {
+            this.handlerReject();
+        }
+
+        if (button.type === 'TRY_SUBMIT') {
+            this.handlerTrySubmit();
+        }
+
+        if (button.type === 'RECALL') {
+            this.handlerRecall();
+        }
+
+        if (button.type === 'REMOVE') {
+            this.handlerRemove();
+        }
+
+        if (button.type === 'URGE') {
+            this.handlerUrge()
+        }
+
+        if (button.type === 'POSTPONED') {
+            this.handlerPostponed();
+        }
+
+        if (button.type === 'TRANSFER') {
+            this.handlerTransfer();
+        }
+
+        if (button.type === "CUSTOM") {
+            this.handlerCustom(button.id);
+        }
+
+        if (button.type === 'VIEW') {
+            this.handlerView(button.eventKey);
+        }
+    }
+}
diff --git a/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts b/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts
new file mode 100644
index 00000000..3901ed9d
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts
@@ -0,0 +1,348 @@
+import {FlowRecordContext} from "@/components/flow/domain/FlowRecordContext";
+import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
+import * as flowApi from "@/api/flow";
+import {FlowUser} from "@/components/flow/types";
+import {FlowSubmitResultParser} from "@/components/flow/domain/FlowResultParser";
+import {UserSelectMode} from "@/components/flow/store/FlowSlice";
+import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
+import FormInstance from "@/components/form/domain/FormInstance";
+
+/**
+ * 流程的事件控制上下文对象
+ */
+export class FlowEventContext {
+
+    private readonly flowRecordContext: FlowRecordContext;
+    private readonly flowTriggerContext: FlowTriggerContext;
+    private readonly flowInstance: FormInstance;
+    private readonly opinionInstance: FormInstance;
+    private readonly flowStateContext: FlowStateContext;
+
+    constructor(flowViewContext: FlowRecordContext,
+                flowTriggerContext: FlowTriggerContext,
+                flowInstance: FormInstance,
+                opinionInstance: FormInstance,
+                flowStateContext: FlowStateContext) {
+        this.flowRecordContext = flowViewContext;
+        this.flowTriggerContext = flowTriggerContext;
+        this.flowInstance = flowInstance;
+        this.opinionInstance = opinionInstance;
+        this.flowStateContext = flowStateContext;
+    }
+
+    private getRequestBody = () => {
+        const formData = this.opinionInstance.getFieldsValue();
+        const flowData = this.flowRecordContext.getFlowFormParams();
+        const workCode = this.flowRecordContext.getWorkCode();
+        const recordId = this.flowStateContext.getRecordId();
+        const advice = this.opinionInstance.getFieldsValue();
+
+        return {
+            recordId,
+            workCode,
+            ...advice,
+            formData: {
+                ...flowData,
+                ...formData,
+            }
+        }
+    }
+
+
+    private validateForm = async () => {
+        const formState = await this.flowInstance.validate();
+        const opinionState = await this.opinionInstance.validate();
+        return formState && opinionState;
+    }
+
+    /**
+     * 发起流程
+     * @param callback 回调函数
+     */
+    startFlow = (callback?: (res: any) => void) => {
+        const body = this.getRequestBody();
+        this.flowStateContext.setRequestLoading(true);
+        flowApi.startFlow(body)
+            .then(res => {
+                if (res.success) {
+                    const newRecordId = res.data.records[0].id;
+                    this.flowStateContext.setRecordId(newRecordId);
+
+                    if (callback) {
+                        callback(res);
+                    }
+                }
+            })
+            .finally(() => {
+                this.flowStateContext.setRequestLoading(false);
+            })
+    }
+
+
+    /**
+     * 提交流程
+     * @param approvalState 是否审批通过
+     * @param callback 回调函数
+     * @param operatorIds 指定审批人
+     */
+    submitFlow = (approvalState: boolean, callback?: (res: any) => void, operatorIds?: number[]) => {
+        this.validateForm().then((validateState) => {
+            if (validateState) {
+                const body = {
+                    ...this.getRequestBody(),
+                    success: approvalState,
+                    operatorIds: operatorIds,
+                }
+                this.flowStateContext.setRequestLoading(true);
+                flowApi.submitFlow(body)
+                    .then(res => {
+                        if (res.success) {
+                            if (callback) {
+                                callback(res);
+                            }
+                        }
+                    })
+                    .finally(() => {
+                        this.flowStateContext.setRequestLoading(false);
+                    })
+            }
+        })
+    }
+
+    /**
+     * 删除流程
+     * @param callback 回调函数
+     */
+    removeFlow = (callback?: (res: any) => void) => {
+        this.flowStateContext.setRequestLoading(true);
+        const body = {
+            recordId: this.flowStateContext.getRecordId()
+        };
+        flowApi.removeFlow(body).then(res => {
+            if (res.success) {
+                if (callback) {
+                    callback(res);
+                }
+            }
+        }).finally(() => {
+            this.flowStateContext.setRequestLoading(false);
+        })
+    }
+
+    /**
+     * 保存流程
+     * @param callback 回调函数
+     */
+    saveFlow = (callback?: (res: any) => void) => {
+        this.flowStateContext.setRequestLoading(true);
+        const body = this.getRequestBody();
+        flowApi.saveFlow(body).then(res => {
+            if (res.success) {
+                if (callback) {
+                    callback(res);
+                }
+            }
+        }).finally(() => {
+            this.flowStateContext.setRequestLoading(false);
+        })
+    }
+
+    /**
+     * 延期流程
+     * @param timeOut 延期时间
+     * @param callback 回调函数
+     */
+    postponedFlow(timeOut: number, callback?: (res: any) => void) {
+        this.flowStateContext.setRequestLoading(true);
+        const body = {
+            recordId: this.flowStateContext.getRecordId(),
+            timeOut
+        };
+        flowApi.postponed(body).then(res => {
+            if (res.success) {
+                if (callback) {
+                    callback(res);
+                }
+            }
+        }).finally(() => {
+            this.flowStateContext.setRequestLoading(false);
+        })
+    }
+
+    /**
+     * 自定义流程
+     * @param buttonId 自定义按钮Id
+     * @param callback 回调函数
+     */
+    customFlow(buttonId: string, callback?: (res: any) => void) {
+        this.validateForm().then((validateState) => {
+            console.log('validateState', validateState);
+            if (validateState) {
+                const body = {
+                    ...this.getRequestBody(),
+                    buttonId: buttonId,
+                }
+                this.flowStateContext.setRequestLoading(true);
+                flowApi.custom(body)
+                    .then(res => {
+                        if (res.success) {
+                            if (callback) {
+                                callback(res);
+                            }
+                        }
+                    })
+                    .finally(() => {
+                        this.flowStateContext.setRequestLoading(false);
+                    })
+            }
+        })
+    }
+
+    /**
+     * 转办流程
+     * @param user 转办用户
+     * @param callback 回调函数
+     */
+    transferFlow(user: FlowUser, callback?: (res: any) => void) {
+        this.validateForm().then((validateState) => {
+            if (validateState) {
+                const body = {
+                    ...this.getRequestBody(),
+                    targetUserId: user.id
+                }
+                this.flowStateContext.setRequestLoading(true);
+                flowApi.transfer(body)
+                    .then(res => {
+                        if (res.success) {
+                            if (callback) {
+                                callback(res);
+                            }
+                        }
+                    })
+                    .finally(() => {
+                        this.flowStateContext.setRequestLoading(false);
+                    })
+            }
+        })
+    }
+
+    /**
+     * 催办流程
+     * @param callback
+     */
+    urgeFlow(callback?: (res: any) => void) {
+        this.flowStateContext.setRequestLoading(true);
+        const body = {
+            recordId: this.flowStateContext.getRecordId()
+        };
+        flowApi.urge(body).then(res => {
+            if (res.success) {
+                if (callback) {
+                    callback(res);
+                }
+            }
+        }).finally(() => {
+            this.flowStateContext.setRequestLoading(false);
+        })
+    }
+
+    /**
+     * 撤回流程
+     */
+    recallFlow(callback?: (res: any) => void) {
+        this.flowStateContext.setRequestLoading(true);
+        const body = {
+            recordId: this.flowStateContext.getRecordId()
+        };
+        flowApi.recall(body).then(res => {
+            if (res.success) {
+                if (callback) {
+                    callback(res);
+                }
+            }
+        }).finally(() => {
+            this.flowStateContext.setRequestLoading(false);
+        })
+    }
+
+    /**
+     * 预提交流程
+     * @param callback
+     */
+    trySubmitFlow(callback?: (res: any) => void) {
+        this.validateForm().then((validateState) => {
+            if (validateState) {
+                const body = {
+                    ...this.getRequestBody(),
+                    success: true,
+                }
+                this.flowStateContext.setRequestLoading(true);
+                flowApi.trySubmitFlow(body)
+                    .then(res => {
+                        if (res.success) {
+                            if (callback) {
+                                callback(res);
+                            }
+                        }
+                    })
+                    .finally(() => {
+                        this.flowStateContext.setRequestLoading(false);
+                    })
+            }
+        })
+    }
+
+
+    /**
+     * 重新加载流程数据
+     */
+    reloadFlow() {
+        this.flowStateContext.randomVersion();
+    }
+
+
+    /**
+     * 触发流程事件
+     */
+    triggerEvent(eventKey: string) {
+        this.flowTriggerContext.triggerEvent(eventKey);
+    }
+
+    /**
+     * 用户选择回调
+     * @param users 选择用户
+     * @param userSelectMode 用户选择模式
+     */
+    userSelectCallback(users: FlowUser[], userSelectMode: UserSelectMode | null) {
+        if (users.length > 0) {
+            if (userSelectMode) {
+                if (userSelectMode.userSelectType === 'transfer') {
+                    const targetUser = users[0];
+                    this.transferFlow(targetUser, (res) => {
+                        const message = `已经成功转办给${targetUser.name}`;
+                        this.flowStateContext.setResult({
+                            state: 'success',
+                            closeable: true,
+                            title: message,
+                        });
+                    });
+                }
+                if (userSelectMode.userSelectType === 'nextNodeUser') {
+                    const userIds = users.map((item: any) => {
+                        return item.id;
+                    });
+                    this.submitFlow(true, (res) => {
+                        const flowSubmitResultParser = new FlowSubmitResultParser(res.data);
+                        this.flowStateContext.setResult(flowSubmitResultParser.parser());
+                    }, userIds);
+                }
+            }
+        }
+
+        this.flowStateContext.setUserSelectVisible(false);
+    }
+
+}
+
+
+
diff --git a/admin-pro-ui/src/components/flow/domain/FlowPanelContext.ts b/admin-pro-ui/src/components/flow/domain/FlowPanelContext.ts
index 71af0dc9..2bdd5aa6 100644
--- a/admin-pro-ui/src/components/flow/domain/FlowPanelContext.ts
+++ b/admin-pro-ui/src/components/flow/domain/FlowPanelContext.ts
@@ -1,6 +1,6 @@
 import React from "react";
 import {LogicFlow} from "@logicflow/core";
-import {CustomButtonType, NodeButtonProperties, NodeProperties, NodeType} from "@/components/flow/types";
+import {ButtonType, NodeButtonProperties, NodeProperties, NodeType} from "@/components/flow/types";
 import {message} from "antd";
 import {isEmpty} from "lodash-es";
 import NodeData = LogicFlow.NodeData;
@@ -72,7 +72,7 @@ class FlowPanelContext {
         },
     ] as {
         label: string;
-        value: CustomButtonType;
+        value: ButtonType;
     }[];
 
     constructor(lfRef: React.RefObject<LogicFlow>) {
diff --git a/admin-pro-ui/src/components/flow/domain/FlowRecordContext.ts b/admin-pro-ui/src/components/flow/domain/FlowRecordContext.ts
new file mode 100644
index 00000000..cc2a9354
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/domain/FlowRecordContext.ts
@@ -0,0 +1,205 @@
+import {FlowButton, FlowFormView, FlowViewProps} from "@/components/flow/types";
+
+/**
+ * 流程的详情控制上下文对象
+ */
+export class FlowRecordContext {
+
+    private readonly props: FlowViewProps;
+    private readonly data: any;
+
+    constructor(props: FlowViewProps, data?: any) {
+        this.props = props;
+        this.data = data;
+    }
+
+    // 获取流程的工作编码
+    getWorkCode() {
+        return this.data.flowWork.code;
+    }
+
+    // 获取流程的Form视图
+    getFlowFormView() {
+        const view = this.props.view;
+        if (typeof view === 'object') {
+            const nodeView = this.data.flowNode.view;
+            return (view as FlowFormView)[nodeView];
+        }
+        return view;
+    }
+
+
+    // 获取节点的数据
+    getNode = (code: string) => {
+        if (this.data) {
+            const nodes = this.data.flowWork.nodes;
+            for (const node of nodes) {
+                if (node.code === code) {
+                    return node;
+                }
+            }
+        }
+        return null;
+    }
+
+    // 获取当前节点的表单数据 （内部使用）
+    private getNodeState = (code: string) => {
+        const historyRecords = this.data.historyRecords || [];
+        if (code==='over' && this.isFinished()) {
+            return "done";
+        }
+        for (const record of historyRecords) {
+            if (record.nodeCode === code) {
+                if (record.flowType === 'TODO') {
+                    return "current";
+                }
+                return "done";
+            }
+        }
+        if(this.isFinished()){
+            return "undone";
+        }
+        return "wait";
+    }
+
+
+    // 获取历史记录
+    getHistoryRecords = () => {
+        return this.data.historyRecords;
+    }
+
+    // 获取当前的详情的记录数据
+    getCurrentFlowRecord = () => {
+        return this.data.flowRecord;
+    }
+
+    // 获取当前节点的流程图
+    getFlowSchema = () => {
+        if (this.data.flowWork.schema) {
+            const schema = JSON.parse(this.data.flowWork.schema);
+
+            for (const node of schema.nodes) {
+                node.properties.settingVisible = false;
+                node.properties.state = this.getNodeState(node.properties.code);
+            }
+            return schema;
+        }
+        return null;
+    }
+
+    // 获取审批意见
+    getOpinionAdvice = () => {
+        if(this.data.flowRecord){
+            if(this.data.flowRecord.opinion){
+                return this.data.flowRecord.opinion.advice;
+            }
+        }
+        return null;
+    }
+
+    // 获取历史审批意见
+    getHistoryOpinions() {
+        if(this.data.opinions){
+            return this.data.opinions.filter((item:any)=>{
+                if(!item.opinion){
+                    return false;
+                }
+                return item.opinion.result!==0;
+            });
+        }
+        return [];
+    }
+
+    //获取流程的form数据
+    getFlowFormParams() {
+        return {
+            ...this.data.bindData,
+            ...this.props.formParams
+        }
+    }
+
+    // 获取流程的操作按钮
+    getFlowButtons() {
+        const buttons = this.data.flowNode.buttons as FlowButton[] || [];
+        return buttons.sort((item1: any, item2: any) => {
+            return item1.order - item2.order;
+        })
+    }
+
+
+    // 是否可以审批
+    isApproval = () => {
+        return this.data.canHandle;
+    }
+
+    // 是否是开始节点
+    isStartNode = ()=>{
+        if (this.data) {
+            return this.data.flowNode.startNode;
+        }
+        return false;
+    }
+
+    // 获取当前节点的code
+    getNodeCode = () => {
+        if (this.data) {
+            return this.data.flowNode.code;
+        }
+        return null;
+    }
+
+    // 获取当前节点是否可编辑
+    isEditable = () => {
+        if(this.isFinished()){
+            return false;
+        }
+        if(this.isDone()){
+            return false;
+        }
+        return this.getFlowNodeEditable()
+    }
+
+    // 获取当前节点是否可编辑
+    getFlowNodeEditable = () => {
+        if (this.data) {
+            const node = this.data.flowNode;
+            if (node) {
+                return node.editable;
+            }
+        }
+        return false
+    }
+
+    // 是否已审批
+    isDone() {
+        if (this.data.flowRecord) {
+            return this.data.flowRecord.flowStatus === 'FINISH' || this.data.flowRecord.flowType === 'DONE';
+        }
+        return false;
+    }
+
+
+    // 是否完成
+    isFinished() {
+        if (this.data.flowRecord) {
+            return this.data.flowRecord.flowStatus === 'FINISH';
+        }
+        return false;
+    }
+
+
+    // 是否是退回状态
+    isReject(){
+        const historyRecords = this.data.historyRecords || [];
+        const currentRecord = this.data.flowRecord;
+        if(currentRecord && historyRecords.length>0){
+            const preId = currentRecord.preId;
+            const preRecord = historyRecords.find((item:any)=>item.id===preId);
+            if(preRecord){
+                return preRecord.flowSourceDirection === 'REJECT';
+            }
+        }
+        return false;
+    }
+
+}
diff --git a/admin-pro-ui/src/components/flow/domain/FlowResultParser.ts b/admin-pro-ui/src/components/flow/domain/FlowResultParser.ts
new file mode 100644
index 00000000..686e7c67
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/domain/FlowResultParser.ts
@@ -0,0 +1,92 @@
+import {FlowResultMessage} from "@/components/flow/types";
+
+export class FlowWorkData {
+
+    protected readonly data: any;
+
+    constructor(data: any) {
+        this.data = data;
+    }
+
+    getNode = (code: string) => {
+        if (this.data) {
+            const nodes = this.data.flowWork.nodes;
+            for (const node of nodes) {
+                if (node.code === code) {
+                    return node;
+                }
+            }
+        }
+        return null;
+    }
+
+    getWorkCode() {
+        return this.data.flowWork.code;
+    }
+}
+
+
+export class FlowSubmitResultParser extends FlowWorkData {
+
+    constructor(data: any) {
+        super(data);
+    }
+
+    parser() {
+        const records = this.data.records;
+        const resultItems = [];
+        for (const record of records) {
+            const node = this.getNode(record.nodeCode);
+            resultItems.push({
+                label: '下级审批节点',
+                value: node.name
+            });
+
+            resultItems.push({
+                label: '下级审批人',
+                value: record.currentOperator.name
+            });
+        }
+        return {
+            title: '流程审批完成',
+            closeable: true,
+            state: 'success',
+            items: resultItems
+        } as FlowResultMessage;
+    }
+}
+
+
+export class FlowTrySubmitResultParser {
+
+    private readonly data: any;
+
+    constructor(data: any) {
+        this.data = data;
+    }
+
+    parser() {
+        const operators = this.data.operators;
+        const usernames = operators.map((item: any) => {
+            return item.name;
+        });
+        const flowResult = {
+            title: '下级节点提示',
+            closeable: false,
+            state: 'success',
+            items: [
+                {
+                    label: '下级审批节点',
+                    value: this.data.flowNode.name
+                },
+                {
+                    label: '下级审批人',
+                    value: usernames.join(',')
+                }
+            ]
+        }
+
+        return flowResult as FlowResultMessage;
+    }
+
+}
diff --git a/admin-pro-ui/src/components/flow/domain/FlowStateContext.tsx b/admin-pro-ui/src/components/flow/domain/FlowStateContext.tsx
new file mode 100644
index 00000000..5f2368c7
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/domain/FlowStateContext.tsx
@@ -0,0 +1,95 @@
+import {FlowStore, UserSelectMode} from "@/components/flow/store/FlowSlice";
+import {FlowResultMessage} from "@/components/flow/types";
+
+/**
+ * 流程的状态数据上下文对象
+ */
+export class FlowStateContext {
+
+    private currentState: FlowStore;
+    private readonly updateFlowStore: (currentState: any) => any;
+
+    constructor(currentState: FlowStore, updateFlowStore: (state: any) => any) {
+        this.currentState = JSON.parse(JSON.stringify(currentState));
+        this.updateFlowStore = updateFlowStore;
+    }
+
+    private updateState() {
+        this.updateFlowStore({
+            ...this.currentState
+        })
+    }
+
+    setRequestLoading = (requestLoading: boolean) => {
+        this.currentState = {
+            ...this.currentState,
+            requestLoading
+        }
+        this.updateState();
+    }
+
+    setRecordId = (recordId: string) => {
+        this.currentState = {
+            ...this.currentState,
+            recordId
+        }
+        this.updateState();
+    }
+
+    setResult = (result: FlowResultMessage) => {
+        this.currentState = {
+            ...this.currentState,
+            result
+        }
+        this.updateState();
+    }
+
+    clearResult = () => {
+        this.currentState = {
+            ...this.currentState,
+            result: null
+        }
+        this.updateState();
+    }
+
+    hasRecordId = () => {
+        return this.currentState.recordId;
+    }
+
+    getRecordId = () => {
+        return this.currentState.recordId;
+    }
+
+    setPostponedVisible(visible: boolean) {
+        this.currentState = {
+            ...this.currentState,
+            postponedVisible: visible
+        }
+        this.updateState();
+    }
+
+    setUserSelectVisible(visible: boolean) {
+        this.currentState = {
+            ...this.currentState,
+            userSelectVisible: visible
+        }
+        this.updateState();
+    }
+
+    setUserSelectMode(userSelectMode: UserSelectMode) {
+        this.currentState = {
+            ...this.currentState,
+            userSelectVisible: true,
+            userSelectMode: userSelectMode
+        }
+        this.updateState();
+    }
+
+    randomVersion() {
+        this.currentState = {
+            ...this.currentState,
+            version: Math.random()
+        }
+        this.updateState();
+    }
+}
diff --git a/admin-pro-ui/src/components/flow/domain/FlowTriggerContext.ts b/admin-pro-ui/src/components/flow/domain/FlowTriggerContext.ts
new file mode 100644
index 00000000..7e673682
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/domain/FlowTriggerContext.ts
@@ -0,0 +1,32 @@
+export interface EventTrigger {
+    trigger: (eventKey: string) => void
+}
+
+// 流程事件触发器上下文对象
+export class FlowTriggerContext {
+
+    private list: EventTrigger[] = [];
+
+    constructor() {
+    }
+
+    // 添加触发器
+    addTrigger(trigger:(eventKey:string)=>void) {
+        this.list.push({
+            trigger
+        });
+    }
+
+    // 触发事件
+    triggerEvent(eventKey: string) {
+        this.list.forEach(trigger => {
+            trigger.trigger(eventKey);
+        })
+    }
+
+    clear() {
+        this.list = [];
+    }
+
+}
+
diff --git a/admin-pro-ui/src/components/flow/store/FlowSlice.ts b/admin-pro-ui/src/components/flow/store/FlowSlice.ts
index 3fddc261..ab1f5bdd 100644
--- a/admin-pro-ui/src/components/flow/store/FlowSlice.ts
+++ b/admin-pro-ui/src/components/flow/store/FlowSlice.ts
@@ -1,26 +1,118 @@
-import {configureStore, createSlice} from '@reduxjs/toolkit';
+import {configureStore, createSlice, PayloadAction} from '@reduxjs/toolkit';
+import {FlowResultMessage, UserSelectFormType} from "@/components/flow/types";
 
 export interface FlowStore {
+    // 流程记录ID
+    recordId: string;
+    // 请求加载中
+    requestLoading: boolean;
+    // 流程结果
+    result: FlowResultMessage | null;
+    // 隐藏page的内容
+    contentHiddenVisible: boolean;
+    // 版本号
+    version: number;
+    // 数据版本号
+    dataVersion: number;
 
+    // 意见框展示状态
+    opinionVisible: boolean;
+
+    // 延期时间窗口状态
+    postponedVisible: boolean;
+    // 选人窗口状态
+    userSelectVisible: boolean;
+    // 选人状态
+    userSelectMode: UserSelectMode | null;
 }
 
-export type FlowStoreAction = {
+export interface UserSelectMode {
+    // 指定人员范围
+    specifyUserIds?: number[];
+    // 当前选择的人员
+    currentUserIds?: number[];
+    // 选人类型
+    userSelectType: UserSelectFormType;
+    // 是否多选
+    multiple: boolean;
+}
 
+export type FlowStoreAction = {
+    updateState: (state: FlowStore, action: PayloadAction<any>) => void;
+    initState: (state: FlowStore) => void;
 }
 
 export const flowSlice = createSlice<FlowStore, FlowStoreAction, "flow", {}>({
     name: 'flow',
     initialState: {
-
+        recordId: '',
+        requestLoading: false,
+        result: null,
+        contentHiddenVisible: false,
+        postponedVisible: false,
+        opinionVisible: true,
+        userSelectVisible: false,
+        userSelectMode: null,
+        version: 0,
+        dataVersion: 0,
     },
     reducers: {
+        updateState: (state, action) => {
+            const currentState = action.payload;
+            const keys = Object.keys(currentState);
+            if (keys.includes('requestLoading')) {
+                state.requestLoading = currentState.requestLoading;
+            }
+            if (keys.includes('recordId')) {
+                state.recordId = action.payload.recordId;
+            }
+            if (keys.includes('result')) {
+                state.result = action.payload.result;
+                state.contentHiddenVisible = state.result != null;
+            }
+            if (keys.includes('postponedVisible')) {
+                state.postponedVisible = action.payload.postponedVisible;
+            }
 
+            if (keys.includes('userSelectMode')) {
+                state.userSelectVisible = true;
+                state.userSelectMode = action.payload.userSelectMode;
+            }
+
+            if (keys.includes('version')) {
+                state.version = action.payload.version;
+            }
+
+            if (keys.includes('dataVersion')) {
+                state.dataVersion = action.payload.dataVersion;
+            }
+
+            if (keys.includes('userSelectVisible')) {
+                state.userSelectVisible = action.payload.userSelectVisible;
+                if (!state.userSelectVisible) {
+                    state.userSelectMode = null;
+                }
+            }
+        },
+        initState: (state) => {
+            state.recordId = '';
+            state.requestLoading = false;
+            state.result = null;
+            state.postponedVisible = false;
+            state.opinionVisible = true;
+            state.contentHiddenVisible = false;
+            state.userSelectVisible = false;
+            state.userSelectMode = null;
+            state.version = 0;
+            state.dataVersion = 0;
+        }
     },
 });
 
 
 export const {
-
+    updateState,
+    initState
 } = flowSlice.actions;
 export const flowStore = configureStore({
     reducer: {
diff --git a/admin-pro-ui/src/components/flow/types.ts b/admin-pro-ui/src/components/flow/types.ts
index d91b90c6..bf40184b 100644
--- a/admin-pro-ui/src/components/flow/types.ts
+++ b/admin-pro-ui/src/components/flow/types.ts
@@ -55,9 +55,8 @@ export interface FlowUser {
     [key: string]: any;
 }
 
-
 // 自定义按钮类型
-export type CustomButtonType =
+export type ButtonType =
     | 'RELOAD'  // 重新加载
     | 'SAVE'    // 保存
     | 'START'   // 发起
@@ -73,6 +72,18 @@ export type CustomButtonType =
     | 'VIEW'    // 自定义前端事件
     | 'REMOVE'; // 删除
 
+
+// 流程自定义按钮
+export interface FlowButton {
+    id: string;
+    eventKey: string;
+    groovy: string;
+    name: string;
+    order: number;
+    style: any;
+    type: ButtonType;
+}
+
 // 节点属性
 export interface NodeProperties {
     name: string;
@@ -94,7 +105,7 @@ export interface NodeProperties {
 export interface NodeButtonProperties {
     id:string;
     name:string;
-    type:CustomButtonType;
+    type:ButtonType;
     style:string;
     order:number;
     groovy:string;
@@ -110,6 +121,23 @@ export interface SettingPanelProps {
     onSettingChange: (values: any) => void;
 }
 
+// 结果展示数据项目
+export interface FlowResultItem {
+    label: string,
+    value: string
+}
+
+
+type FlowResultMessageState = 'success'|'info'|'warning';
+
+// 结果展示数据信息
+export interface FlowResultMessage {
+    title: string,
+    closeable: boolean,
+    state: FlowResultMessageState,
+    items?: FlowResultItem[]
+}
+
 // 表单参数
 export interface FlowFormParams {
     clazzName: string;
@@ -137,6 +165,10 @@ export interface FlowViewProps {
     id?: string;
     // 流程的设计编号
     workCode?: string;
+
+    // 预览模式
+    review?: boolean;
+
     // 流程的视图数据
     view: React.ComponentType<FlowFormViewProps> | FlowFormView;
     // 表单参数，参数仅当在发起节点时才会传递
diff --git a/admin-pro-ui/src/components/flow/view/FlowModelView.scss b/admin-pro-ui/src/components/flow/view/FlowModelView.scss
index d43856ab..f7906725 100644
--- a/admin-pro-ui/src/components/flow/view/FlowModelView.scss
+++ b/admin-pro-ui/src/components/flow/view/FlowModelView.scss
@@ -23,3 +23,4 @@
     margin: 0 !important;
   }
 }
+
diff --git a/admin-pro-ui/src/components/flow/view/index.scss b/admin-pro-ui/src/components/flow/view/index.scss
new file mode 100644
index 00000000..795744aa
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/view/index.scss
@@ -0,0 +1,9 @@
+.flow-skeleton-header {
+  width: 100%;
+  height: 40px;
+}
+
+.flow-skeleton-body {
+  height: 60vh;
+  width: 100%;
+}
diff --git a/admin-pro-ui/src/components/flow/view/index.tsx b/admin-pro-ui/src/components/flow/view/index.tsx
index 3ab8e886..7ed3b944 100644
--- a/admin-pro-ui/src/components/flow/view/index.tsx
+++ b/admin-pro-ui/src/components/flow/view/index.tsx
@@ -1,10 +1,107 @@
-import React from "react";
+import React, {createContext, useEffect} from "react";
 import {FlowViewProps} from "@/components/flow/types";
+import FormInstance from "@/components/form/domain/FormInstance";
+import {FlowButtonClickContext} from "@/components/flow/domain/FlowButtonClickContext";
+import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
+import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
+import {FlowEventContext} from "@/components/flow/domain/FlowEventContext";
+import {FlowRecordContext} from "@/components/flow/domain/FlowRecordContext";
+import {FlowReduxState, flowStore, initState, updateState} from "@/components/flow/store/FlowSlice";
+import {detail} from "@/api/flow";
+import {Provider, useDispatch, useSelector} from "react-redux";
+import { Skeleton } from "antd";
+import FlowPage from "@/components/flow/components/FlowPage";
+import "./index.scss";
 
+// 流程视图上下文属性
+interface FlowViewReactContextProps {
+    // 流程的详情控制上下文对象
+    flowRecordContext: FlowRecordContext;
+    // 流程的事件控制上下文对象
+    flowEventContext: FlowEventContext;
+    // 流程的状态数据上下文对象
+    flowStateContext: FlowStateContext;
+    // 流程事件触发控制上下文对象
+    flowTriggerContext: FlowTriggerContext;
+    // 流程按钮点击触发控制器上下文对象
+    flowButtonClickContext: FlowButtonClickContext;
+    // 表单操作对象
+    formInstance: FormInstance;
+    // 审批意见操作对象
+    opinionInstance: FormInstance;
+}
+
+export const FlowViewReactContext = createContext<FlowViewReactContextProps | null>(null);
+
+
+const $FlowView:React.FC<FlowViewProps> = (props)=>{
+
+    const [data, setData] = React.useState<any>(null);
+
+    const dispatch = useDispatch();
+
+    const version = useSelector((state: FlowReduxState) => state.flow.version);
+
+    // 请求流程详情数据
+    const loadFlowDetail = () => {
+        if (props.id) {
+            detail(props.id, null).then(res => {
+                if (res.success) {
+                    setData(res.data);
+                }
+            });
+            return;
+        }
+        if (props.workCode) {
+            detail(null, props.workCode).then(res => {
+                if (res.success) {
+                    setData(res.data);
+                }
+            });
+            return;
+        }
+    }
+
+    useEffect(() => {
+        if(data){
+            const dataVersion = Math.random();
+            dispatch(updateState({dataVersion:dataVersion}));
+        }
+    }, [data]);
+
+    useEffect(() => {
+        return ()=>{
+            dispatch(initState());
+        }
+    }, []);
+
+    useEffect(() => {
+        loadFlowDetail();
+    }, [version]);
+
+    return (
+        <>
+            {!data && (
+                <>
+                    <Skeleton  active={true} className={"flow-skeleton-header"}/>
+                    <Skeleton paragraph={{rows:4}} active={true} className={"flow-skeleton-body"}/>
+                </>
+            )}
+            {data && (
+                <FlowPage
+                    {...props}
+                    flowData={data}
+                />
+            )}
+        </>
+    )
+}
 
-const FlowView:React.FC<FlowViewProps> = (props)=>{
+const FlowView: React.FC<FlowViewProps> = (props) => {
     return (
-        <></>
+        <Provider store={flowStore}>
+            <$FlowView  {...props} />
+        </Provider>
     )
 }
 

From cf3e2cafc4f387cb2fefb5c3338b108cf3cb5ea4 Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Tue, 15 Apr 2025 09:19:00 +0800
Subject: [PATCH 04/20] add flow page

---
 .../flow/components/FlowContent.tsx           |  40 ++++++
 .../flow/components/FlowForm404.tsx           |  26 ++++
 .../components/flow/components/FlowHeader.tsx |  75 +++++++++++
 .../components/flow/components/FlowPage.tsx   | 124 +++++++++++++++++-
 .../components/flow/components/FlowResult.tsx |  49 +++++++
 admin-pro-ui/src/components/flow/types.ts     |   4 +
 .../components/flow/view/FlowModelView.tsx    |   7 +-
 .../src/components/flow/view/index.scss       |  27 ++++
 .../src/components/flow/view/index.tsx        |  14 +-
 9 files changed, 349 insertions(+), 17 deletions(-)
 create mode 100644 admin-pro-ui/src/components/flow/components/FlowContent.tsx
 create mode 100644 admin-pro-ui/src/components/flow/components/FlowForm404.tsx
 create mode 100644 admin-pro-ui/src/components/flow/components/FlowHeader.tsx
 create mode 100644 admin-pro-ui/src/components/flow/components/FlowResult.tsx

diff --git a/admin-pro-ui/src/components/flow/components/FlowContent.tsx b/admin-pro-ui/src/components/flow/components/FlowContent.tsx
new file mode 100644
index 00000000..3c4f499e
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/components/FlowContent.tsx
@@ -0,0 +1,40 @@
+import React, {useContext, useEffect} from "react";
+import {FlowFormViewProps} from "@/components/flow/types";
+import {FlowViewReactContext} from "@/components/flow/view";
+import {useSelector} from "react-redux";
+import {FlowReduxState} from "@/components/flow/store/FlowSlice";
+import {Tabs} from "antd";
+
+const FlowContent= () => {
+    const flowViewReactContext = useContext(FlowViewReactContext);
+
+    const flowRecordContext = flowViewReactContext?.flowRecordContext;
+    const formInstance = flowViewReactContext?.formInstance;
+
+    const FlowFormView = flowRecordContext?.getFlowFormView() as React.ComponentType<FlowFormViewProps>;
+
+    const formParams = flowRecordContext?.getFlowFormParams();
+
+    const opinionVisible = useSelector((state: FlowReduxState) => state.flow.opinionVisible);
+    const dataVersion = useSelector((state: FlowReduxState) => state.flow.dataVersion);
+    const contentHiddenVisible = useSelector((state: FlowReduxState) => state.flow.contentHiddenVisible);
+
+    useEffect(() => {
+        if(!flowRecordContext?.isEditable()){
+            setTimeout(()=>{
+                formInstance?.disableAll();
+            },100);
+        }
+    }, []);
+
+    const style = contentHiddenVisible ? {"display":"none"} : {};
+    return (
+        <div className={"flow-view-content"} style={style}>
+            <Tabs>
+
+            </Tabs>
+        </div>
+    )
+}
+
+export default FlowContent;
diff --git a/admin-pro-ui/src/components/flow/components/FlowForm404.tsx b/admin-pro-ui/src/components/flow/components/FlowForm404.tsx
new file mode 100644
index 00000000..1e95b397
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/components/FlowForm404.tsx
@@ -0,0 +1,26 @@
+import React from "react";
+import {Button, Result} from "antd";
+
+interface FlowForm404Props{
+    setVisible:(visible:boolean)=>void;
+}
+
+const FlowForm404:React.FC<FlowForm404Props> = (props)=>{
+
+    return (
+        <Result
+            status='error'
+            title={"抱歉，没有配置流程视图"}
+        >
+            <Button
+                className={"flow-result-content-button"}
+                block={true}
+                onClick={()=>{
+                    props.setVisible(false);
+                }}
+            >关闭页面</Button>
+        </Result>
+    )
+}
+
+export default FlowForm404;
diff --git a/admin-pro-ui/src/components/flow/components/FlowHeader.tsx b/admin-pro-ui/src/components/flow/components/FlowHeader.tsx
new file mode 100644
index 00000000..28c23f51
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/components/FlowHeader.tsx
@@ -0,0 +1,75 @@
+import React, {useContext} from "react";
+import {FlowViewReactContext} from "@/components/flow/view";
+import {useSelector} from "react-redux";
+import {FlowReduxState} from "@/components/flow/store/FlowSlice";
+import {Button} from "antd";
+
+interface FlowHeaderProps{
+    setVisible:(visible:boolean)=>void;
+}
+
+const FlowHeader:React.FC<FlowHeaderProps> = (props) => {
+    const flowViewReactContext = useContext(FlowViewReactContext);
+
+    const flowRecordContext = flowViewReactContext?.flowRecordContext;
+
+    const flowButtonClickContext = flowViewReactContext?.flowButtonClickContext;
+
+    const buttons = flowRecordContext?.getFlowButtons()||[];
+    const requestLoading = useSelector((state: FlowReduxState) => state.flow.requestLoading);
+    const contentHiddenVisible = useSelector((state: FlowReduxState) => state.flow.contentHiddenVisible);
+
+    const style = contentHiddenVisible ? {"display":"none"} : {};
+
+    if(flowRecordContext?.isEditable()){
+        return (
+            <div className={"flow-view-header"} style={style}>
+                {buttons.map((item) => {
+                    const style = item.style && JSON.parse(item.style) || {};
+                    return (
+                        <Button
+                            loading={requestLoading}
+                            key={item.id}
+                            className={"flow-view-header-button"}
+                            style={{
+                                ...style
+                            }}
+                            onClick={() => {
+                                flowButtonClickContext?.handlerClick(item);
+                            }}
+                        >{item.name}</Button>
+                    )
+                })}
+
+                <Button
+                    color={"default"}
+                    className={"flow-view-header-button"}
+                    onClick={() => {
+                        props.setVisible(false);
+                    }}
+                >
+                    关闭
+                </Button>
+
+            </div>
+        )
+    }else {
+        return (
+            <div className={"flow-view-header"} style={style}>
+                <Button
+                    loading={requestLoading}
+                    style={{
+                        marginLeft:'15%',
+                        marginRight:'15%'
+                    }}
+                    className={"flow-view-header-button"}
+                    onClick={() => {
+                        props.setVisible(false);
+                    }}
+                >关闭</Button>
+            </div>
+        )
+    }
+}
+
+export default FlowHeader;
diff --git a/admin-pro-ui/src/components/flow/components/FlowPage.tsx b/admin-pro-ui/src/components/flow/components/FlowPage.tsx
index 4b50caf6..79f87037 100644
--- a/admin-pro-ui/src/components/flow/components/FlowPage.tsx
+++ b/admin-pro-ui/src/components/flow/components/FlowPage.tsx
@@ -1,5 +1,26 @@
-import React from "react";
-import {FlowViewProps} from "@/components/flow/types";
+import React, {useEffect} from "react";
+import {
+    FlowFormViewProps,
+    FlowViewProps,
+    PostponedFormProps,
+    PostponedFormViewKey,
+    UserSelectFormProps,
+    UserSelectFormViewKey
+} from "@/components/flow/types";
+import FlowHeader from "@/components/flow/components/FlowHeader";
+import {FlowReduxState, updateState} from "@/components/flow/store/FlowSlice";
+import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
+import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
+import Form from "@/components/form";
+import {FlowRecordContext} from "@/components/flow/domain/FlowRecordContext";
+import {useDispatch, useSelector} from "react-redux";
+import {FlowEventContext} from "@/components/flow/domain/FlowEventContext";
+import {FlowButtonClickContext} from "@/components/flow/domain/FlowButtonClickContext";
+import {getComponent} from "@/framework/ComponentBus";
+import {FlowViewReactContext} from "../view";
+import FlowResult from "@/components/flow/components/FlowResult";
+import FlowContent from "@/components/flow/components/FlowContent";
+import FlowForm404 from "@/components/flow/components/FlowForm404";
 
 
 interface FlowPageProps extends FlowViewProps {
@@ -7,10 +28,105 @@ interface FlowPageProps extends FlowViewProps {
     flowData: any;
 }
 
-
 const FlowPage:React.FC<FlowPageProps> = (props)=>{
+
+    const dispatch = useDispatch();
+
+    const currentState = useSelector((state: FlowReduxState) => state.flow);
+    const flowRecordContext = new FlowRecordContext(props, props.flowData);
+    const formInstance = Form.useForm();
+    const opinionInstance = Form.useForm();
+
+    const flowStateContext = new FlowStateContext(currentState, (state: any) => {
+        dispatch(updateState({
+            ...state
+        }));
+    });
+    const flowTriggerContext = new FlowTriggerContext();
+    const flowEvenContext = new FlowEventContext(flowRecordContext, flowTriggerContext, formInstance, opinionInstance, flowStateContext);
+    const flowButtonClickContext = new FlowButtonClickContext(flowEvenContext, flowStateContext);
+    const FlowFormView = flowRecordContext.getFlowFormView() as React.ComponentType<FlowFormViewProps>;
+
+    // 延期表单视图
+    const PostponedFormView = getComponent(PostponedFormViewKey) as React.ComponentType<PostponedFormProps>;
+    // 选人表单视图
+    const UserSelectFormView = getComponent(UserSelectFormViewKey) as React.ComponentType<UserSelectFormProps>;
+
+    const version = useSelector((state: FlowReduxState) => state.flow.version);
+
+    // 设置流程编号
+    useEffect(() => {
+        if (props.id) {
+            flowStateContext.setRecordId(props.id);
+        }
+    }, [version]);
+
+    if (FlowFormView) {
+        return (
+            <FlowViewReactContext.Provider value={{
+                flowRecordContext: flowRecordContext,
+                flowEventContext: flowEvenContext,
+                flowStateContext: flowStateContext,
+                flowTriggerContext: flowTriggerContext,
+                flowButtonClickContext: flowButtonClickContext,
+
+                formInstance: formInstance,
+                opinionInstance: opinionInstance
+            }}>
+                <div className={"flow-view"}>
+                    <FlowHeader setVisible={props.setVisible}/>
+                    {currentState.result && (
+                        <FlowResult/>
+                    )}
+                    <FlowContent/>
+                </div>
+
+                {PostponedFormView && (
+                    <PostponedFormView
+                        visible={currentState.postponedVisible}
+                        setVisible={(visible: boolean) => {
+                            flowStateContext.setPostponedVisible(visible);
+                        }}
+                        onFinish={(timeOut) => {
+                            flowEvenContext.postponedFlow(timeOut, (res) => {
+                                flowStateContext.setResult({
+                                    title: '延期成功',
+                                    state: 'success',
+                                    closeable: true,
+                                    items: [
+                                        {
+                                            label: '延期时间',
+                                            value: `${timeOut}小时`
+                                        }
+                                    ]
+                                })
+                            });
+                        }}
+                    />
+                )}
+
+                {UserSelectFormView && currentState.userSelectMode && (
+                    <UserSelectFormView
+                        visible={currentState.userSelectVisible}
+                        setVisible={(visible: boolean) => {
+                            flowStateContext.setUserSelectVisible(visible);
+                        }}
+                        onFinish={(users) => {
+                            // 选择的人
+                            flowEvenContext.userSelectCallback(users, currentState.userSelectMode);
+                        }}
+                        multiple={currentState.userSelectMode.multiple}
+                        specifyUserIds={currentState.userSelectMode.specifyUserIds}
+                        currentUserIds={currentState.userSelectMode.currentUserIds}
+                        userSelectType={currentState.userSelectMode.userSelectType}
+                    />
+                )}
+
+            </FlowViewReactContext.Provider>
+        )
+    }
     return (
-        <></>
+        <FlowForm404 setVisible={props.setVisible}/>
     )
 }
 
diff --git a/admin-pro-ui/src/components/flow/components/FlowResult.tsx b/admin-pro-ui/src/components/flow/components/FlowResult.tsx
new file mode 100644
index 00000000..e01379e8
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/components/FlowResult.tsx
@@ -0,0 +1,49 @@
+import React, {useContext} from "react";
+import {useSelector} from "react-redux";
+import {FlowReduxState} from "@/components/flow/store/FlowSlice";
+import {useNavigate} from "react-router";
+import {FlowViewReactContext} from "@/components/flow/view";
+import {Button, Result} from "antd";
+
+
+const FlowResult = () => {
+
+    const result = useSelector((state: FlowReduxState) => state.flow.result);
+    const navigate = useNavigate();
+
+    const flowViewReactContext = useContext(FlowViewReactContext);
+
+    return (
+        <Result
+            status={result?.state}
+            title={result?.title}
+        >
+            <div className={"flow-result-content"}>
+                {result && result.items && result.items.map((item) => {
+                    return (
+                        <div className={"flow-result-content-item"}>
+                            <div className={"flow-result-content-item-label"}>{item.label}:</div>
+                            <div className={"flow-result-content-item-value"}>{item.value}</div>
+                        </div>
+                    )
+                })}
+
+                <div className={"flow-result-content-footer"}>
+                    <Button
+                        className={"flow-result-content-button"}
+                        block={true}
+                        onClick={() => {
+                            if (result && result.closeable) {
+                                navigate(-1);
+                            }else {
+                                flowViewReactContext?.flowStateContext?.clearResult();
+                            }
+                        }}
+                    >关闭页面</Button>
+                </div>
+            </div>
+        </Result>
+    )
+}
+
+export default FlowResult;
diff --git a/admin-pro-ui/src/components/flow/types.ts b/admin-pro-ui/src/components/flow/types.ts
index bf40184b..70ec6a3d 100644
--- a/admin-pro-ui/src/components/flow/types.ts
+++ b/admin-pro-ui/src/components/flow/types.ts
@@ -166,6 +166,10 @@ export interface FlowViewProps {
     // 流程的设计编号
     workCode?: string;
 
+    visible:boolean;
+
+    setVisible:(visible:boolean)=>void;
+
     // 预览模式
     review?: boolean;
 
diff --git a/admin-pro-ui/src/components/flow/view/FlowModelView.tsx b/admin-pro-ui/src/components/flow/view/FlowModelView.tsx
index 5463ef7b..ec7a6c13 100644
--- a/admin-pro-ui/src/components/flow/view/FlowModelView.tsx
+++ b/admin-pro-ui/src/components/flow/view/FlowModelView.tsx
@@ -4,12 +4,7 @@ import {Modal} from "antd";
 import FlowView from "@/components/flow/view/index";
 import "./FlowModelView.scss";
 
-interface FlowModelViewProps extends FlowViewProps{
-    visible:boolean;
-    setVisible:(visible:boolean)=>void;
-}
-
- const FlowModelView:React.FC<FlowModelViewProps> = (props)=>{
+ const FlowModelView:React.FC<FlowViewProps> = (props)=>{
     return (
         <Modal
             className={"flow-modal"}
diff --git a/admin-pro-ui/src/components/flow/view/index.scss b/admin-pro-ui/src/components/flow/view/index.scss
index 795744aa..7adc0c7c 100644
--- a/admin-pro-ui/src/components/flow/view/index.scss
+++ b/admin-pro-ui/src/components/flow/view/index.scss
@@ -1,3 +1,6 @@
+@use "@/config/variables" as *;
+$flow-footer-height: 80px;
+
 .flow-skeleton-header {
   width: 100%;
   height: 40px;
@@ -7,3 +10,27 @@
   height: 60vh;
   width: 100%;
 }
+
+.flow-view {
+  background-color: white !important;
+  width: 100%;
+}
+
+
+.flow-view-header {
+  height: $flow-footer-height;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  .flow-view-header-button {
+    margin: 10px;
+    font-size: 14px;
+    padding: 8px 8px;
+    width: 100%;
+    border-color: $theme-primary-color;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+  }
+}
diff --git a/admin-pro-ui/src/components/flow/view/index.tsx b/admin-pro-ui/src/components/flow/view/index.tsx
index 7ed3b944..01eec8f1 100644
--- a/admin-pro-ui/src/components/flow/view/index.tsx
+++ b/admin-pro-ui/src/components/flow/view/index.tsx
@@ -9,7 +9,7 @@ import {FlowRecordContext} from "@/components/flow/domain/FlowRecordContext";
 import {FlowReduxState, flowStore, initState, updateState} from "@/components/flow/store/FlowSlice";
 import {detail} from "@/api/flow";
 import {Provider, useDispatch, useSelector} from "react-redux";
-import { Skeleton } from "antd";
+import {Skeleton} from "antd";
 import FlowPage from "@/components/flow/components/FlowPage";
 import "./index.scss";
 
@@ -34,7 +34,7 @@ interface FlowViewReactContextProps {
 export const FlowViewReactContext = createContext<FlowViewReactContextProps | null>(null);
 
 
-const $FlowView:React.FC<FlowViewProps> = (props)=>{
+const $FlowView: React.FC<FlowViewProps> = (props) => {
 
     const [data, setData] = React.useState<any>(null);
 
@@ -63,14 +63,14 @@ const $FlowView:React.FC<FlowViewProps> = (props)=>{
     }
 
     useEffect(() => {
-        if(data){
+        if (data) {
             const dataVersion = Math.random();
-            dispatch(updateState({dataVersion:dataVersion}));
+            dispatch(updateState({dataVersion: dataVersion}));
         }
     }, [data]);
 
     useEffect(() => {
-        return ()=>{
+        return () => {
             dispatch(initState());
         }
     }, []);
@@ -83,8 +83,8 @@ const $FlowView:React.FC<FlowViewProps> = (props)=>{
         <>
             {!data && (
                 <>
-                    <Skeleton  active={true} className={"flow-skeleton-header"}/>
-                    <Skeleton paragraph={{rows:4}} active={true} className={"flow-skeleton-body"}/>
+                    <Skeleton active={true} className={"flow-skeleton-header"}/>
+                    <Skeleton paragraph={{rows: 4}} active={true} className={"flow-skeleton-body"}/>
                 </>
             )}
             {data && (

From e161c91719971051b05865594af5bc4466e55cf7 Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Tue, 15 Apr 2025 12:03:03 +0800
Subject: [PATCH 05/20] add flow FlowHeader

---
 .../components/flow/components/FlowButton.tsx | 75 +++++++++++++++++++
 .../flow/components/FlowContent.tsx           | 32 +++++---
 .../components/flow/components/FlowHeader.tsx | 74 ++++--------------
 .../components/flow/components/FlowPage.tsx   |  4 +-
 .../flow/domain/FlowRecordContext.ts          |  6 ++
 .../src/components/flow/view/index.scss       | 27 +++++--
 .../flow/domain/FlowRecordContext.ts          |  6 ++
 7 files changed, 145 insertions(+), 79 deletions(-)
 create mode 100644 admin-pro-ui/src/components/flow/components/FlowButton.tsx

diff --git a/admin-pro-ui/src/components/flow/components/FlowButton.tsx b/admin-pro-ui/src/components/flow/components/FlowButton.tsx
new file mode 100644
index 00000000..511e6081
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/components/FlowButton.tsx
@@ -0,0 +1,75 @@
+import React, {useContext} from "react";
+import {FlowViewReactContext} from "@/components/flow/view";
+import {useSelector} from "react-redux";
+import {FlowReduxState} from "@/components/flow/store/FlowSlice";
+import {Button} from "antd";
+
+interface FlowHeaderProps{
+    setVisible:(visible:boolean)=>void;
+}
+
+const FlowButton:React.FC<FlowHeaderProps> = (props) => {
+    const flowViewReactContext = useContext(FlowViewReactContext);
+
+    const flowRecordContext = flowViewReactContext?.flowRecordContext;
+
+    const flowButtonClickContext = flowViewReactContext?.flowButtonClickContext;
+
+    const buttons = flowRecordContext?.getFlowButtons()||[];
+    const requestLoading = useSelector((state: FlowReduxState) => state.flow.requestLoading);
+    const contentHiddenVisible = useSelector((state: FlowReduxState) => state.flow.contentHiddenVisible);
+
+    const style = contentHiddenVisible ? {"display":"none"} : {};
+
+    if(flowRecordContext?.isEditable()){
+        return (
+            <div className={"flow-buttons-content"} style={style}>
+                {buttons.map((item) => {
+                    const style = item.style && JSON.parse(item.style) || {};
+                    return (
+                        <Button
+                            loading={requestLoading}
+                            key={item.id}
+                            className={"flow-buttons-item"}
+                            style={{
+                                ...style
+                            }}
+                            onClick={() => {
+                                flowButtonClickContext?.handlerClick(item);
+                            }}
+                        >{item.name}</Button>
+                    )
+                })}
+
+                <Button
+                    color={"default"}
+                    className={"flow-buttons-item"}
+                    onClick={() => {
+                        props.setVisible(false);
+                    }}
+                >
+                    关闭
+                </Button>
+
+            </div>
+        )
+    }else {
+        return (
+            <div className={"flow-buttons-content"} style={style}>
+                <Button
+                    loading={requestLoading}
+                    style={{
+                        marginLeft:'15%',
+                        marginRight:'15%'
+                    }}
+                    className={"flow-buttons-item"}
+                    onClick={() => {
+                        props.setVisible(false);
+                    }}
+                >关闭</Button>
+            </div>
+        )
+    }
+}
+
+export default FlowButton;
diff --git a/admin-pro-ui/src/components/flow/components/FlowContent.tsx b/admin-pro-ui/src/components/flow/components/FlowContent.tsx
index 3c4f499e..866cbf68 100644
--- a/admin-pro-ui/src/components/flow/components/FlowContent.tsx
+++ b/admin-pro-ui/src/components/flow/components/FlowContent.tsx
@@ -3,9 +3,9 @@ import {FlowFormViewProps} from "@/components/flow/types";
 import {FlowViewReactContext} from "@/components/flow/view";
 import {useSelector} from "react-redux";
 import {FlowReduxState} from "@/components/flow/store/FlowSlice";
-import {Tabs} from "antd";
+import {Tabs, TabsProps} from "antd";
 
-const FlowContent= () => {
+const FlowContent = () => {
     const flowViewReactContext = useContext(FlowViewReactContext);
 
     const flowRecordContext = flowViewReactContext?.flowRecordContext;
@@ -20,19 +20,33 @@ const FlowContent= () => {
     const contentHiddenVisible = useSelector((state: FlowReduxState) => state.flow.contentHiddenVisible);
 
     useEffect(() => {
-        if(!flowRecordContext?.isEditable()){
-            setTimeout(()=>{
+        if (!flowRecordContext?.isEditable()) {
+            setTimeout(() => {
                 formInstance?.disableAll();
-            },100);
+            }, 100);
         }
     }, []);
 
-    const style = contentHiddenVisible ? {"display":"none"} : {};
+    const style = contentHiddenVisible ? {"display": "none"} : {};
+
+    const items = [
+        {
+            label: '流程详情',
+            key: 'detail'
+        },
+        {
+            label: '流程记录',
+            key: 'record'
+        },
+        {
+            label: '流程图',
+            key: 'chart'
+        }
+    ] as TabsProps['items'];
+
     return (
         <div className={"flow-view-content"} style={style}>
-            <Tabs>
-
-            </Tabs>
+            <Tabs items={items}/>
         </div>
     )
 }
diff --git a/admin-pro-ui/src/components/flow/components/FlowHeader.tsx b/admin-pro-ui/src/components/flow/components/FlowHeader.tsx
index 28c23f51..99b6ce06 100644
--- a/admin-pro-ui/src/components/flow/components/FlowHeader.tsx
+++ b/admin-pro-ui/src/components/flow/components/FlowHeader.tsx
@@ -1,75 +1,27 @@
 import React, {useContext} from "react";
+import FlowButton from "@/components/flow/components/FlowButton";
 import {FlowViewReactContext} from "@/components/flow/view";
-import {useSelector} from "react-redux";
-import {FlowReduxState} from "@/components/flow/store/FlowSlice";
-import {Button} from "antd";
 
 interface FlowHeaderProps{
     setVisible:(visible:boolean)=>void;
 }
 
-const FlowHeader:React.FC<FlowHeaderProps> = (props) => {
+// 流程详情header头信息
+const FlowHeader:React.FC<FlowHeaderProps> = (props)=>{
     const flowViewReactContext = useContext(FlowViewReactContext);
+    const flowRecordContext =  flowViewReactContext?.flowRecordContext;
+    const currentNode = flowRecordContext?.getCurrentNode();
 
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-
-    const flowButtonClickContext = flowViewReactContext?.flowButtonClickContext;
-
-    const buttons = flowRecordContext?.getFlowButtons()||[];
-    const requestLoading = useSelector((state: FlowReduxState) => state.flow.requestLoading);
-    const contentHiddenVisible = useSelector((state: FlowReduxState) => state.flow.contentHiddenVisible);
-
-    const style = contentHiddenVisible ? {"display":"none"} : {};
-
-    if(flowRecordContext?.isEditable()){
-        return (
-            <div className={"flow-view-header"} style={style}>
-                {buttons.map((item) => {
-                    const style = item.style && JSON.parse(item.style) || {};
-                    return (
-                        <Button
-                            loading={requestLoading}
-                            key={item.id}
-                            className={"flow-view-header-button"}
-                            style={{
-                                ...style
-                            }}
-                            onClick={() => {
-                                flowButtonClickContext?.handlerClick(item);
-                            }}
-                        >{item.name}</Button>
-                    )
-                })}
-
-                <Button
-                    color={"default"}
-                    className={"flow-view-header-button"}
-                    onClick={() => {
-                        props.setVisible(false);
-                    }}
-                >
-                    关闭
-                </Button>
-
+    return (
+        <div className={"flow-header"}>
+            <div className={"flow-header-left"}>
+                {currentNode && currentNode.name}
             </div>
-        )
-    }else {
-        return (
-            <div className={"flow-view-header"} style={style}>
-                <Button
-                    loading={requestLoading}
-                    style={{
-                        marginLeft:'15%',
-                        marginRight:'15%'
-                    }}
-                    className={"flow-view-header-button"}
-                    onClick={() => {
-                        props.setVisible(false);
-                    }}
-                >关闭</Button>
+            <div className={"flow-header-right"}>
+                <FlowButton setVisible={props.setVisible}/>
             </div>
-        )
-    }
+        </div>
+    )
 }
 
 export default FlowHeader;
diff --git a/admin-pro-ui/src/components/flow/components/FlowPage.tsx b/admin-pro-ui/src/components/flow/components/FlowPage.tsx
index 79f87037..26645cc5 100644
--- a/admin-pro-ui/src/components/flow/components/FlowPage.tsx
+++ b/admin-pro-ui/src/components/flow/components/FlowPage.tsx
@@ -7,7 +7,7 @@ import {
     UserSelectFormProps,
     UserSelectFormViewKey
 } from "@/components/flow/types";
-import FlowHeader from "@/components/flow/components/FlowHeader";
+import FlowButton from "@/components/flow/components/FlowButton";
 import {FlowReduxState, updateState} from "@/components/flow/store/FlowSlice";
 import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
 import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
@@ -21,6 +21,7 @@ import {FlowViewReactContext} from "../view";
 import FlowResult from "@/components/flow/components/FlowResult";
 import FlowContent from "@/components/flow/components/FlowContent";
 import FlowForm404 from "@/components/flow/components/FlowForm404";
+import FlowHeader from "@/components/flow/components/FlowHeader";
 
 
 interface FlowPageProps extends FlowViewProps {
@@ -75,6 +76,7 @@ const FlowPage:React.FC<FlowPageProps> = (props)=>{
             }}>
                 <div className={"flow-view"}>
                     <FlowHeader setVisible={props.setVisible}/>
+
                     {currentState.result && (
                         <FlowResult/>
                     )}
diff --git a/admin-pro-ui/src/components/flow/domain/FlowRecordContext.ts b/admin-pro-ui/src/components/flow/domain/FlowRecordContext.ts
index cc2a9354..69fa1339 100644
--- a/admin-pro-ui/src/components/flow/domain/FlowRecordContext.ts
+++ b/admin-pro-ui/src/components/flow/domain/FlowRecordContext.ts
@@ -42,6 +42,12 @@ export class FlowRecordContext {
         return null;
     }
 
+    // 获取当前的节点信息
+    getCurrentNode=()=>{
+        const currentNodeCode = this.getNodeCode();
+        return this.getNode(currentNodeCode);
+    }
+
     // 获取当前节点的表单数据 （内部使用）
     private getNodeState = (code: string) => {
         const historyRecords = this.data.historyRecords || [];
diff --git a/admin-pro-ui/src/components/flow/view/index.scss b/admin-pro-ui/src/components/flow/view/index.scss
index 7adc0c7c..d27afb4e 100644
--- a/admin-pro-ui/src/components/flow/view/index.scss
+++ b/admin-pro-ui/src/components/flow/view/index.scss
@@ -16,19 +16,30 @@ $flow-footer-height: 80px;
   width: 100%;
 }
 
-
-.flow-view-header {
-  height: $flow-footer-height;
+.flow-header{
   display: flex;
+  justify-content: space-between;
   align-items: center;
+
+  .flow-header-left{
+    font-size: 16pt;
+  }
+
+  .flow-header-right{
+
+  }
+
+}
+
+.flow-buttons-content {
+  display: flex;
   justify-content: center;
 
-  .flow-view-header-button {
-    margin: 10px;
+  .flow-buttons-item {
     font-size: 14px;
-    padding: 8px 8px;
-    width: 100%;
-    border-color: $theme-primary-color;
+    margin: 5px 5px;
+    padding-left: 20px;
+    padding-right: 20px;
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
diff --git a/mobile-ui/src/components/flow/domain/FlowRecordContext.ts b/mobile-ui/src/components/flow/domain/FlowRecordContext.ts
index cc2a9354..69fa1339 100644
--- a/mobile-ui/src/components/flow/domain/FlowRecordContext.ts
+++ b/mobile-ui/src/components/flow/domain/FlowRecordContext.ts
@@ -42,6 +42,12 @@ export class FlowRecordContext {
         return null;
     }
 
+    // 获取当前的节点信息
+    getCurrentNode=()=>{
+        const currentNodeCode = this.getNodeCode();
+        return this.getNode(currentNodeCode);
+    }
+
     // 获取当前节点的表单数据 （内部使用）
     private getNodeState = (code: string) => {
         const historyRecords = this.data.historyRecords || [];

From 2b3a56c317f6f953cdcff35c0c325e1d8c5e0ebc Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Tue, 15 Apr 2025 17:28:16 +0800
Subject: [PATCH 06/20] add flow detail

---
 .../src/components/descriptions/index.scss    |  34 ++++
 .../src/components/descriptions/index.tsx     |  99 +++++++++++
 .../components/flow/components/FlowChart.tsx  |  95 ++++++++++
 .../flow/components/FlowContent.tsx           |  47 ++++-
 .../flow/components/FlowFormOpinion.tsx       |  45 +++++
 .../flow/components/FlowHistory.tsx           | 167 ++++++++++++++++++
 .../flow/components/FlowHistoryLine.tsx       |  55 ++++++
 .../flow/components/FlowOpinion.tsx           |  54 ++++++
 admin-pro-ui/src/components/flow/types.ts     |   2 +-
 .../src/components/flow/view/index.scss       |  20 ++-
 admin-pro-ui/src/config/variables.scss        |   5 +
 .../src/pages/flow/leave/LeaveForm.tsx        |   8 +-
 12 files changed, 625 insertions(+), 6 deletions(-)
 create mode 100644 admin-pro-ui/src/components/descriptions/index.scss
 create mode 100644 admin-pro-ui/src/components/descriptions/index.tsx
 create mode 100644 admin-pro-ui/src/components/flow/components/FlowChart.tsx
 create mode 100644 admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx
 create mode 100644 admin-pro-ui/src/components/flow/components/FlowHistory.tsx
 create mode 100644 admin-pro-ui/src/components/flow/components/FlowHistoryLine.tsx
 create mode 100644 admin-pro-ui/src/components/flow/components/FlowOpinion.tsx

diff --git a/admin-pro-ui/src/components/descriptions/index.scss b/admin-pro-ui/src/components/descriptions/index.scss
new file mode 100644
index 00000000..bd0d0289
--- /dev/null
+++ b/admin-pro-ui/src/components/descriptions/index.scss
@@ -0,0 +1,34 @@
+@use "@/config/variables" as *;
+
+.descriptions-list {
+  padding: 3px;
+  background-color: white;
+
+  .descriptions-list-item {
+    background-color: white;
+    padding: 15px;
+    font-size: $content-font-size;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    border-bottom: 1px solid $body-background-color;
+
+    .descriptions-list-item-label {
+      font-weight: bold;
+    }
+
+    .descriptions-list-item-value {
+    }
+  }
+
+  .form-header-title {
+    width: 100%;
+    height: 20px;
+    border-left: 4px solid $theme-primary-color;
+    padding-left: 4px;
+    font-size: 14px;
+    margin-bottom: 10px;
+  }
+}
+
+
diff --git a/admin-pro-ui/src/components/descriptions/index.tsx b/admin-pro-ui/src/components/descriptions/index.tsx
new file mode 100644
index 00000000..f32d86ce
--- /dev/null
+++ b/admin-pro-ui/src/components/descriptions/index.tsx
@@ -0,0 +1,99 @@
+import React, {useEffect, useImperativeHandle} from "react";
+import {FormField} from "@/components/form/types";
+import "./index.scss";
+
+export interface DescriptionsAction {
+    // 重新刷新数据
+    reload: () => void;
+}
+
+// 详情展示属性
+interface DescriptionsProps {
+    // 展示的字段
+    columns?: FormField[];
+    // 请求数据
+    request?: () => Promise<any>;
+    // 操作对象
+    actionRef?: React.Ref<DescriptionsAction>;
+    // 页脚
+    footer?: React.ReactNode;
+    // 页头
+    header?: React.ReactNode;
+    // 数据转换
+    dataConvert?: (field: FormField, data: any) => Promise<any>;
+}
+
+// 详情展示
+const Descriptions: React.FC<DescriptionsProps> = (props) => {
+
+    const [data, setData] = React.useState<any>(null);
+
+    const reload = () => {
+        if (props.request) {
+            props.request().then((data) => {
+                if(props.dataConvert) {
+                    const promise = [] as Promise<any>[];
+                    props.columns?.map(item => {
+                        promise.push(new Promise<any>((resolve, reject) => {
+                            props.dataConvert?.(item, data).then(value => {
+                                data[item.props.name] = value;
+                                resolve(value);
+                            }).catch(reject);
+                        }));
+                    });
+                    Promise.all(promise).then(() => {
+                        setData(data);
+                    });
+                }else {
+                    setData(data);
+                }
+            })
+        }
+    }
+
+    useImperativeHandle(props.actionRef, () => ({
+        reload: () => {
+            reload()
+        }
+    }), [props.actionRef]);
+
+    useEffect(() => {
+        reload();
+
+        return () => {
+            setData(null);
+        }
+    }, []);
+
+    return (
+        <div className={"descriptions-list"}>
+            {props.header}
+            {data && props.columns && props.columns
+                .filter(item => !item.props.hidden)
+                .map((item) => {
+                    const key = item.props.name;
+                    const label = item.props.label as string || "";
+                    const value = data[key];
+                    const valueType = typeof value === 'object' ? 'object' : 'string';
+                    return (
+                        <div className={"descriptions-list-item"}>
+                            <div className={"descriptions-list-item-label"}
+                                 dangerouslySetInnerHTML={{__html: label }}/>
+                            {valueType === 'string' && (
+                                <div className={"descriptions-list-item-value"}
+                                     dangerouslySetInnerHTML={{__html: value}}/>
+                            )}
+                            {valueType === 'object' && (
+                                <div className={"descriptions-list-item-value"}>
+                                    {value}
+                                </div>
+                            )}
+                        </div>
+                    )
+                })}
+            {props.footer}
+        </div>
+    )
+}
+
+export default Descriptions;
diff --git a/admin-pro-ui/src/components/flow/components/FlowChart.tsx b/admin-pro-ui/src/components/flow/components/FlowChart.tsx
new file mode 100644
index 00000000..325d53f4
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/components/FlowChart.tsx
@@ -0,0 +1,95 @@
+import React, {useContext, useEffect} from "react";
+import '@logicflow/core/es/index.css';
+import '@logicflow/extension/lib/style/index.css';
+import {LogicFlow, Options} from "@logicflow/core";
+import {DndPanel, Menu, MiniMap, Snapshot} from "@logicflow/extension";
+import {FlowViewReactContext} from "@/components/flow/view";
+import Start from "@/components/flow/nodes/Start";
+import Over from "@/components/flow/nodes/Over";
+import Circulate from "@/components/flow/nodes/Circulate";
+import Node from "@/components/flow/nodes/Node";
+import "@/components/flow/index.scss";
+
+import EdgeType = Options.EdgeType;
+
+interface FlowChartProps {
+    edgeType?: EdgeType;
+}
+
+const FlowChart: React.FC<FlowChartProps> = (props) => {
+
+    const flowViewReactContext = useContext(FlowViewReactContext);
+    const flowRecordContext = flowViewReactContext?.flowRecordContext;
+    const flowSchema = flowRecordContext?.getFlowSchema();
+
+    const [url, setUrl] = React.useState<string>('');
+
+    const edgeType = props.edgeType || 'polyline';
+    const container = React.useRef<HTMLDivElement>(null);
+    const lfRef = React.useRef<LogicFlow>(null);
+
+    useEffect(() => {
+        const SilentConfig = {
+            isSilentMode: true,
+            stopScrollGraph: false,
+            stopMoveGraph: false,
+            stopZoomGraph: false,
+            edgeTextEdit: false,
+        };
+
+        //@ts-ignore
+        lfRef.current = new LogicFlow({
+            //@ts-ignore
+            container: container.current,
+            ...SilentConfig,
+            background: {
+                backgroundColor: '#f3f5f8'
+            },
+            width: 0,
+            height: 0,
+            plugins: [Menu, DndPanel, MiniMap, Snapshot],
+            grid: false,
+            edgeType: edgeType,
+        });
+
+        lfRef.current.setTheme({
+            bezier: {
+                stroke: '#8f94e3',
+                strokeWidth: 1,
+            },
+            polyline: {
+                stroke: '#8f94e3',
+                strokeWidth: 1,
+            },
+            line: {
+                stroke: '#8f94e3',
+                strokeWidth: 1,
+            },
+        });
+        lfRef.current.register(Start);
+        lfRef.current.register(Node);
+        lfRef.current.register(Over);
+        lfRef.current.register(Circulate);
+        lfRef.current.render(flowSchema);
+
+        setTimeout(() => {
+            lfRef.current?.getSnapshotBlob().then((blob: any) => {
+                setUrl(URL.createObjectURL(blob.data));
+            });
+        }, 100)
+
+    }, [flowViewReactContext]);
+
+    return (
+        <div>
+            <div className="flow-chart">
+                <div className={"flow-chart-content"} ref={container}/>
+                {url && (
+                    <img src={url} className={"flow-img"}/>
+                )}
+            </div>
+        </div>
+    )
+}
+
+export default FlowChart;
diff --git a/admin-pro-ui/src/components/flow/components/FlowContent.tsx b/admin-pro-ui/src/components/flow/components/FlowContent.tsx
index 866cbf68..f7a857d8 100644
--- a/admin-pro-ui/src/components/flow/components/FlowContent.tsx
+++ b/admin-pro-ui/src/components/flow/components/FlowContent.tsx
@@ -3,7 +3,12 @@ import {FlowFormViewProps} from "@/components/flow/types";
 import {FlowViewReactContext} from "@/components/flow/view";
 import {useSelector} from "react-redux";
 import {FlowReduxState} from "@/components/flow/store/FlowSlice";
-import {Tabs, TabsProps} from "antd";
+import {Divider, Tabs, TabsProps} from "antd";
+import FlowFormOpinion from "@/components/flow/components/FlowFormOpinion";
+import FlowHistory from "@/components/flow/components/FlowHistory";
+import FlowOpinion from "@/components/flow/components/FlowOpinion";
+import FlowChart from "@/components/flow/components/FlowChart";
+import FlowHistoryLine from "@/components/flow/components/FlowHistoryLine";
 
 const FlowContent = () => {
     const flowViewReactContext = useContext(FlowViewReactContext);
@@ -18,6 +23,7 @@ const FlowContent = () => {
     const opinionVisible = useSelector((state: FlowReduxState) => state.flow.opinionVisible);
     const dataVersion = useSelector((state: FlowReduxState) => state.flow.dataVersion);
     const contentHiddenVisible = useSelector((state: FlowReduxState) => state.flow.contentHiddenVisible);
+    const [currentTab, setCurrentTab] = React.useState('detail');
 
     useEffect(() => {
         if (!flowRecordContext?.isEditable()) {
@@ -46,7 +52,44 @@ const FlowContent = () => {
 
     return (
         <div className={"flow-view-content"} style={style}>
-            <Tabs items={items}/>
+            <Tabs
+                items={items}
+                activeKey={currentTab}
+                onChange={(value) => {
+                    setCurrentTab(value)
+                }}/>
+
+            {currentTab ==='detail' && (
+                <>
+                    {formInstance && (
+                        <FlowFormView
+                            data={formParams}
+                            form={formInstance}
+                            dataVersion={dataVersion}
+                        />
+                    )}
+
+                    {opinionVisible && (
+                        <FlowFormOpinion/>
+                    )}
+                </>
+            )}
+
+            {currentTab ==='record' && (
+                <>
+                    <FlowHistory/>
+                    <Divider>审批记录</Divider>
+                    <FlowOpinion/>
+                </>
+            )}
+
+            {currentTab ==='chart' && (
+                <>
+                    <FlowChart/>
+                    <Divider>流转历史</Divider>
+                    <FlowHistoryLine/>
+                </>
+            )}
         </div>
     )
 }
diff --git a/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx b/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx
new file mode 100644
index 00000000..6d966f2c
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx
@@ -0,0 +1,45 @@
+import React, {useContext, useEffect} from "react";
+import Form from "@/components/form";
+import {FlowViewReactContext} from "@/components/flow/view";
+
+const FlowFormOpinion = ()=>{
+
+    const flowViewReactContext = useContext(FlowViewReactContext);
+    const opinionInstance = flowViewReactContext?.opinionInstance;
+    const flowRecordContext = flowViewReactContext?.flowRecordContext;
+
+    useEffect(() => {
+        opinionInstance?.setFieldValue("advice", flowRecordContext?.getOpinionAdvice());
+    }, []);
+
+    return (
+        <>
+            <Form
+                form={opinionInstance}
+                loadFields={async ()=>{
+                    return [
+                        {
+                            type:'textarea',
+                            props:{
+                                name:"advice",
+                                label:"审批意见",
+                                textAreaRows:2,
+                                required:true,
+                                validateFunction:async (content)=>{
+                                    const value = content.value;
+                                    if(value){
+                                        return [];
+                                    }
+                                    return ["请输入审批意见"];
+                                }
+                            }
+                        }
+                    ]
+                }}
+            >
+            </Form>
+        </>
+    )
+}
+
+export default FlowFormOpinion;
diff --git a/admin-pro-ui/src/components/flow/components/FlowHistory.tsx b/admin-pro-ui/src/components/flow/components/FlowHistory.tsx
new file mode 100644
index 00000000..c81b8533
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/components/FlowHistory.tsx
@@ -0,0 +1,167 @@
+import React, {useContext} from "react";
+import {FlowViewReactContext} from "@/components/flow/view";
+import Descriptions from "@/components/descriptions";
+import {FormField} from "@/components/form/types";
+import moment from "moment";
+import {Tag} from "antd";
+
+const fields = [
+    {
+        type: 'input',
+        props: {
+            name: 'title',
+            label: '',
+        }
+    },
+    {
+        type: 'input',
+        props: {
+            name: 'createOperatorName',
+            label: '发起人',
+        }
+    },
+    {
+        type: 'input',
+        props: {
+            name: 'createOperatorDate',
+            label: '发起时间',
+        }
+    },
+    {
+        type: 'input',
+        props: {
+            name: 'flowStatus',
+            label: '状态',
+        }
+    },
+    {
+        type: 'input',
+        props: {
+            name: 'recodeType',
+            label: '流程状态',
+        }
+    },
+    {
+        type: 'input',
+        props: {
+            name: 'postponedCount',
+            label: '是否延期',
+        }
+    },
+    {
+        type: 'input',
+        props: {
+            name: 'interfere',
+            label: '是否干预',
+        }
+    },
+    {
+        type: 'input',
+        props: {
+            name: 'read',
+            label: '是否已读',
+        }
+    },
+    {
+        type: 'input',
+        props: {
+            name: 'timeoutTime',
+            label: '超时时间',
+        }
+    },
+    {
+        type: 'input',
+        props: {
+            name: 'nodeName',
+            label: '节点名称',
+        }
+    }
+] as FormField[];
+
+const flowStatusConvert = (data: any) => {
+    if (data.flowStatus === 'RUNNING') {
+        return '进行中';
+    }
+    if (data.flowStatus === 'FINISH') {
+        return '已结束';
+    }
+    return '';
+}
+
+const recodeTypeConvert = (data: any) => {
+    if (data.flowType === 'TODO') {
+        return <Tag color={'primary'}>待办</Tag>;
+    }
+    if (data.flowType === 'DONE') {
+        return <Tag color={'success'}>已办</Tag>;
+    }
+    if (data.flowType === 'TRANSFER') {
+        return <Tag color={'blue'}>已转办</Tag>;
+    }
+    return '';
+}
+
+const postponedCountConvert = (data: any) => {
+    if (data.postponedCount > 0) {
+        return '延期';
+    }
+    return '未延期';
+}
+
+const interfereConvert = (data: any) => {
+    if (data.interfere) {
+        return '干预';
+    }
+    return '未干预';
+}
+
+const readConvert = (data: any) => {
+    if (data.read) {
+        return '已读';
+    }
+    return '未读';
+}
+
+const timeoutTimeConvert = (data: any) => {
+    if (data.timeoutTime == 0) {
+        return '未设置';
+    }
+    return moment(data.timeoutTime).format("YYYY-MM-DD HH:mm:ss");
+}
+
+
+const FlowHistory = () => {
+    const flowViewReactContext = useContext(FlowViewReactContext);
+    const flowRecordContext = flowViewReactContext?.flowRecordContext;
+
+    const currentFlowRecord = flowRecordContext?.getCurrentFlowRecord();
+
+    if(currentFlowRecord) {
+        return (
+            <div className={"flow-history"}>
+                <div className={"flow-basic"}>
+                    <Descriptions
+                        columns={fields}
+                        request={async () => {
+                            return {
+                                ...currentFlowRecord,
+                                createOperatorName: currentFlowRecord.createOperator?.name,
+                                createOperatorDate: moment(currentFlowRecord.createTime).format('YYYY-MM-DD HH:mm:ss'),
+                                flowStatus: flowStatusConvert(currentFlowRecord),
+                                recodeType: recodeTypeConvert(currentFlowRecord),
+                                postponedCount: postponedCountConvert(currentFlowRecord),
+                                interfere: interfereConvert(currentFlowRecord),
+                                read: readConvert(currentFlowRecord),
+                                timeoutTime: timeoutTimeConvert(currentFlowRecord),
+                                nodeName: flowRecordContext?.getNode(currentFlowRecord.nodeCode)?.name,
+                            };
+                        }}
+                    />
+                </div>
+            </div>
+        )
+    }
+    return <></>
+}
+
+export default FlowHistory;
diff --git a/admin-pro-ui/src/components/flow/components/FlowHistoryLine.tsx b/admin-pro-ui/src/components/flow/components/FlowHistoryLine.tsx
new file mode 100644
index 00000000..6f3fd5bf
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/components/FlowHistoryLine.tsx
@@ -0,0 +1,55 @@
+import React, {useContext} from "react";
+import {FlowViewReactContext} from "@/components/flow/view";
+import moment from "moment";
+import {Tag} from "antd";
+
+const recodeTypeConvert = (data: any) => {
+    if (data.flowType === 'TODO') {
+        return <Tag color={'primary'}>待办</Tag>;
+    }
+    if (data.flowType === 'DONE') {
+        return <Tag color={'success'}>已办</Tag>;
+    }
+    if (data.flowType === 'TRANSFER') {
+        return <Tag color={'blue'}>已转办</Tag>;
+    }
+    return '';
+}
+
+
+const FlowHistoryLine = () => {
+    const flowViewReactContext = useContext(FlowViewReactContext);
+    const flowRecordContext = flowViewReactContext?.flowRecordContext;
+
+    const historyRecords = flowRecordContext?.getHistoryRecords();
+
+    return (
+        <div className={"flow-history"}>
+            <div className={"flow-history-list"}>
+                {historyRecords && historyRecords.map((historyRecord: any, index: number) => {
+                    const nodeName = flowRecordContext?.getNode(historyRecord.nodeCode)?.name;
+                    const recodeType = recodeTypeConvert(historyRecord);
+                    const createName = historyRecord.createOperator?.name;
+                    const createTime = moment(historyRecord.createTime).format('YYYY-MM-DD HH:mm:ss');
+                    const flowAdvice = historyRecord.opinion?.advice || '暂无意见';
+                    return (
+                        <div className={"flow-history-list-item"}>
+                            <div className={"flow-history-list-item-line"}>
+                                {historyRecords.length > (index + 1) &&  <div className={"flow-history-list-item-dot"}/>}
+                            </div>
+                            <div className={"flow-history-list-item-content"}>
+                                <div className={"flow-history-list-item-title"}>{nodeName}</div>
+                                <div className={"flow-history-list-item-attr"}>状态:{recodeType}</div>
+                                <div className={"flow-history-list-item-attr"}>创建人:{createName}</div>
+                                <div className={"flow-history-list-item-attr"}>创建时间:{createTime}</div>
+                                <div className={"flow-history-list-item-attr"}>审批意见:{flowAdvice}</div>
+                            </div>
+                        </div>
+                    )
+                })}
+            </div>
+        </div>
+    )
+}
+
+export default FlowHistoryLine;
diff --git a/admin-pro-ui/src/components/flow/components/FlowOpinion.tsx b/admin-pro-ui/src/components/flow/components/FlowOpinion.tsx
new file mode 100644
index 00000000..4ff19b83
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/components/FlowOpinion.tsx
@@ -0,0 +1,54 @@
+import React, {useContext} from "react";
+import {FlowViewReactContext} from "@/components/flow/view";
+import moment from "moment";
+
+
+const optionStateConvert = (data: any) => {
+    if (data.opinion.result === 1) {
+        return '转办'
+    }
+    if (data.opinion.result === 2) {
+        return '通过'
+    }
+    if (data.opinion.result === 3) {
+        return '驳回'
+    }
+    return '暂存'
+}
+
+const FlowOpinion = () => {
+
+    const flowViewReactContext = useContext(FlowViewReactContext);
+    const flowRecordContext = flowViewReactContext?.flowRecordContext;
+
+    const historyOpinions = flowRecordContext?.getHistoryOpinions();
+
+    return (
+        <>
+            {historyOpinions && historyOpinions.map((item: any) => {
+                const flowOperatorName = item.operator.name;
+                const optionState = optionStateConvert(item);
+                const createTime = moment(item.createTime).format("YYYY-MM-DD HH:mm:ss");
+                const advice = item.opinion.advice;
+                return (
+                    <div className={"flow-history-opinion-item"}>
+                        <div className={"flow-history-opinion-item-row"}>
+                            <span>审批人：</span>
+                            <span>{flowOperatorName} {optionState}</span>
+                        </div>
+                        <div className={"flow-history-opinion-item-row"}>
+                            <span>审批时间：</span>
+                            <span>{createTime}</span>
+                        </div>
+                        <div className={"flow-history-opinion-item-row"}>
+                            <span>审批意见：</span>
+                            <span>{advice}</span>
+                        </div>
+                    </div>
+                )
+            })}
+        </>
+    )
+}
+
+export default FlowOpinion;
diff --git a/admin-pro-ui/src/components/flow/types.ts b/admin-pro-ui/src/components/flow/types.ts
index 70ec6a3d..0b0521c8 100644
--- a/admin-pro-ui/src/components/flow/types.ts
+++ b/admin-pro-ui/src/components/flow/types.ts
@@ -150,7 +150,7 @@ export interface FlowFormViewProps {
     // 表单数据
     data: FlowFormParams;
     // 表单控制对象
-    formInstance: FormInstance;
+    form: FormInstance;
     // 数据版本
     dataVersion?: number;
 }
diff --git a/admin-pro-ui/src/components/flow/view/index.scss b/admin-pro-ui/src/components/flow/view/index.scss
index d27afb4e..201c720e 100644
--- a/admin-pro-ui/src/components/flow/view/index.scss
+++ b/admin-pro-ui/src/components/flow/view/index.scss
@@ -1,6 +1,7 @@
 @use "@/config/variables" as *;
 $flow-footer-height: 80px;
 
+
 .flow-skeleton-header {
   width: 100%;
   height: 40px;
@@ -16,13 +17,30 @@ $flow-footer-height: 80px;
   width: 100%;
 }
 
+
+.flow-chart {
+  transition: 0.3s;
+  border-radius: 12px;
+  text-align: center;
+
+  .flow-chart-content {
+    width: 0;
+    height: 0;
+  }
+
+  .flow-img {
+
+  }
+}
+
+
 .flow-header{
   display: flex;
   justify-content: space-between;
   align-items: center;
 
   .flow-header-left{
-    font-size: 16pt;
+    font-size: $title-font-size;
   }
 
   .flow-header-right{
diff --git a/admin-pro-ui/src/config/variables.scss b/admin-pro-ui/src/config/variables.scss
index da639f27..db056393 100644
--- a/admin-pro-ui/src/config/variables.scss
+++ b/admin-pro-ui/src/config/variables.scss
@@ -2,3 +2,8 @@
 $theme-primary-color: #4a79d8;
 // 背景颜色
 $body-background-color: #e6e7ea;
+
+// 标题字体大小
+$title-font-size: 16px;
+// 内容字体大小
+$content-font-size:14px;
diff --git a/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx b/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
index 1602ea71..efc526c4 100644
--- a/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
+++ b/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
@@ -8,12 +8,16 @@ import FormTextArea from "@/components/form/textarea";
 const LeaveForm: React.FC<FlowFormViewProps> = (props) => {
 
     useEffect(() => {
-        props.formInstance.setFieldsValue(props.data)
+        if (props.dataVersion && props.data) {
+            props.form?.setFieldsValue({
+                ...props.data
+            });
+        }
     }, [props.dataVersion]);
 
     return (
         <Form
-            form={props.formInstance}
+            form={props.form}
         >
 
             <FormInput

From 77bcd549e8d481fdf9c732a88b14b09040ebc0a0 Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Tue, 15 Apr 2025 17:32:16 +0800
Subject: [PATCH 07/20] add flow detail

---
 .../src/components/form/domain/FormInstance.tsx       | 11 +----------
 mobile-ui/src/components/form/domain/FormInstance.tsx | 11 +----------
 2 files changed, 2 insertions(+), 20 deletions(-)

diff --git a/admin-pro-ui/src/components/form/domain/FormInstance.tsx b/admin-pro-ui/src/components/form/domain/FormInstance.tsx
index e40d722b..b1d0e433 100644
--- a/admin-pro-ui/src/components/form/domain/FormInstance.tsx
+++ b/admin-pro-ui/src/components/form/domain/FormInstance.tsx
@@ -2,7 +2,7 @@ import {FormValidateContext} from "@/components/form/validate";
 import {FormFieldOptionListenerContext, FormFieldReloadListenerContext} from "@/components/form/listener";
 import {NamePath} from "rc-field-form/es/interface";
 import {FormField} from "@/components/form/types";
-import {Form as AntdForm, message} from "antd";
+import {Form as AntdForm} from "antd";
 import {FiledData, FormAction} from "@/components/form";
 import {FormInstance as AntdFormInstance} from "antd/es/form/hooks/useForm";
 import React from "react";
@@ -60,7 +60,6 @@ class FormInstance {
 
     public hidden = (name: NamePath) => {
         if (this.fields.length == 0) {
-            message.error('表单项未加载').then();
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -81,7 +80,6 @@ class FormInstance {
 
     public required = (name: NamePath, required: boolean) => {
         if (this.fields.length == 0) {
-            message.error('表单项未加载').then();
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -101,7 +99,6 @@ class FormInstance {
 
     public show = (name: NamePath) => {
         if (this.fields.length == 0) {
-            message.error('表单项未加载').then();
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -121,7 +118,6 @@ class FormInstance {
 
     public disable = (name: NamePath) => {
         if (this.fields.length == 0) {
-            message.error('表单项未加载').then();
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -141,7 +137,6 @@ class FormInstance {
 
     public disableAll = () => {
         if (this.fields.length == 0) {
-            message.error('表单项未加载').then();
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -158,7 +153,6 @@ class FormInstance {
 
     public enable = (name: NamePath) => {
         if (this.fields.length == 0) {
-            message.error('表单项未加载').then();
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -178,7 +172,6 @@ class FormInstance {
 
     public enableAll = () => {
         if (this.fields.length == 0) {
-            message.error('表单项未加载').then();
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -195,7 +188,6 @@ class FormInstance {
 
     public remove = (name: NamePath) => {
         if (this.fields.length == 0) {
-            message.error('表单项未加载').then();
             return;
         }
         this.updateFields(prevFields => prevFields.filter((field) => !this.namePathEqual(field.props.name, name)));
@@ -204,7 +196,6 @@ class FormInstance {
 
     public create = (field: FormField, index?: number) => {
         if (this.fields.length == 0) {
-            message.error('表单项未加载').then();
             return;
         }
         this.updateFields(prevFields => {
diff --git a/mobile-ui/src/components/form/domain/FormInstance.tsx b/mobile-ui/src/components/form/domain/FormInstance.tsx
index e3e42d3b..7502c8f0 100644
--- a/mobile-ui/src/components/form/domain/FormInstance.tsx
+++ b/mobile-ui/src/components/form/domain/FormInstance.tsx
@@ -3,7 +3,7 @@ import {FormFieldOptionListenerContext, FormFieldReloadListenerContext} from "@/
 import {FormInstance as MobileFormInstance} from "rc-field-form/es/interface";
 import {FormField} from "@/components/form/types";
 import {NamePath} from "antd-mobile/es/components/form";
-import {Form as MobileForm, Toast} from "antd-mobile";
+import {Form as MobileForm} from "antd-mobile";
 import {FiledData, FormAction} from "@/components/form";
 import React from "react";
 
@@ -60,7 +60,6 @@ class FormInstance {
 
     public hidden = (name: NamePath) => {
         if (this.fields.length == 0) {
-            Toast.show('表单项未加载');
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -81,7 +80,6 @@ class FormInstance {
 
     public required = (name: NamePath, required: boolean) => {
         if (this.fields.length == 0) {
-            Toast.show('表单项未加载');
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -101,7 +99,6 @@ class FormInstance {
 
     public show = (name: NamePath) => {
         if (this.fields.length == 0) {
-            Toast.show('表单项未加载');
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -121,7 +118,6 @@ class FormInstance {
 
     public disable = (name: NamePath) => {
         if (this.fields.length == 0) {
-            Toast.show('表单项未加载');
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -141,7 +137,6 @@ class FormInstance {
 
     public disableAll = () => {
         if (this.fields.length == 0) {
-            Toast.show('表单项未加载');
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -158,7 +153,6 @@ class FormInstance {
 
     public enable = (name: NamePath) => {
         if (this.fields.length == 0) {
-            Toast.show('表单项未加载');
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -178,7 +172,6 @@ class FormInstance {
 
     public enableAll = () => {
         if (this.fields.length == 0) {
-            Toast.show('表单项未加载');
             return;
         }
         this.updateFields(prevFields => prevFields.map((field) => {
@@ -195,7 +188,6 @@ class FormInstance {
 
     public remove = (name: NamePath) => {
         if (this.fields.length == 0) {
-            Toast.show('表单项未加载');
             return;
         }
         this.updateFields(prevFields => prevFields.filter((field) => !this.namePathEqual(field.props.name,name)));
@@ -204,7 +196,6 @@ class FormInstance {
 
     public create = (field: FormField, index?: number) => {
         if (this.fields.length == 0) {
-            Toast.show('表单项未加载');
             return;
         }
         this.updateFields(prevFields => {

From a68cd4f36059b3d74699ccea576d5a16dc7571cd Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Tue, 15 Apr 2025 21:30:59 +0800
Subject: [PATCH 08/20] add flow

---
 .../src/components/flow/components/FlowFormOpinion.tsx        | 1 +
 admin-pro-ui/src/components/flow/domain/FlowEventContext.ts   | 2 +-
 admin-pro-ui/src/components/flow/view/index.scss              | 2 +-
 admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx               | 2 ++
 admin-pro-ui/src/pages/flow/leave/index.tsx                   | 2 +-
 mobile-ui/src/components/flow/domain/FlowEventContext.ts      | 4 +---
 6 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx b/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx
index 6d966f2c..08e25d8c 100644
--- a/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx
+++ b/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx
@@ -16,6 +16,7 @@ const FlowFormOpinion = ()=>{
         <>
             <Form
                 form={opinionInstance}
+                layout={"vertical"}
                 loadFields={async ()=>{
                     return [
                         {
diff --git a/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts b/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts
index 3901ed9d..715e5412 100644
--- a/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts
+++ b/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts
@@ -31,7 +31,7 @@ export class FlowEventContext {
     }
 
     private getRequestBody = () => {
-        const formData = this.opinionInstance.getFieldsValue();
+        const formData = this.flowInstance.getFieldsValue();
         const flowData = this.flowRecordContext.getFlowFormParams();
         const workCode = this.flowRecordContext.getWorkCode();
         const recordId = this.flowStateContext.getRecordId();
diff --git a/admin-pro-ui/src/components/flow/view/index.scss b/admin-pro-ui/src/components/flow/view/index.scss
index 201c720e..84d70004 100644
--- a/admin-pro-ui/src/components/flow/view/index.scss
+++ b/admin-pro-ui/src/components/flow/view/index.scss
@@ -29,7 +29,7 @@ $flow-footer-height: 80px;
   }
 
   .flow-img {
-
+    width: 30vw;
   }
 }
 
diff --git a/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx b/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
index efc526c4..ad317b31 100644
--- a/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
+++ b/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
@@ -9,6 +9,7 @@ const LeaveForm: React.FC<FlowFormViewProps> = (props) => {
 
     useEffect(() => {
         if (props.dataVersion && props.data) {
+            console.log('data',props.data);
             props.form?.setFieldsValue({
                 ...props.data
             });
@@ -18,6 +19,7 @@ const LeaveForm: React.FC<FlowFormViewProps> = (props) => {
     return (
         <Form
             form={props.form}
+            layout={"vertical"}
         >
 
             <FormInput
diff --git a/admin-pro-ui/src/pages/flow/leave/index.tsx b/admin-pro-ui/src/pages/flow/leave/index.tsx
index 7b0a8b7c..14f38ec7 100644
--- a/admin-pro-ui/src/pages/flow/leave/index.tsx
+++ b/admin-pro-ui/src/pages/flow/leave/index.tsx
@@ -59,7 +59,7 @@ const LeavePage = () => {
                 view={LeaveForm}
                 workCode={"leave"}
                 formParams={{
-                    clazzName: 'com.codingapi.example.domain.Leave',
+                    clazzName: 'com.codingapi.example.infra.flow.form.LeaveForm',
                     username: username
                 }}
             />
diff --git a/mobile-ui/src/components/flow/domain/FlowEventContext.ts b/mobile-ui/src/components/flow/domain/FlowEventContext.ts
index 2abeda57..b05a3d80 100644
--- a/mobile-ui/src/components/flow/domain/FlowEventContext.ts
+++ b/mobile-ui/src/components/flow/domain/FlowEventContext.ts
@@ -1,5 +1,3 @@
-import React from "react";
-import {FormAction} from "@/components/form";
 import {FlowRecordContext} from "@/components/flow/domain/FlowRecordContext";
 import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
 import * as flowApi from "@/api/flow";
@@ -33,7 +31,7 @@ export class FlowEventContext {
     }
 
     private getRequestBody = () => {
-        const formData = this.opinionInstance.getFieldsValue();
+        const formData = this.flowInstance.getFieldsValue();
         const flowData = this.flowRecordContext.getFlowFormParams();
         const workCode = this.flowRecordContext.getWorkCode();
         const recordId = this.flowStateContext.getRecordId();

From ca3d90fd4eb8ebd88118ffcddb0d199777181620 Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Fri, 25 Apr 2025 09:25:20 +0800
Subject: [PATCH 09/20] add mirco component bus

---
 .../components/flow/components/FlowPage.tsx   |   7 +-
 .../components/flow/nodes/panel/NodePanel.tsx |   4 +-
 .../flow/register/flow.register.tsx           |   6 +-
 admin-pro-ui/src/config/menus.tsx             |   6 +
 .../src/framework/ComponentBus/index.tsx      |  80 ++++++++++--
 admin-pro-ui/src/gateway/default/Header.tsx   |  17 +++
 admin-pro-ui/src/gateway/index.tsx            |   6 +
 admin-pro-ui/src/pages/mirco/index.tsx        | 114 ++++++++++++++++++
 admin-pro-ui/src/pages/welcome/index.tsx      |   1 -
 9 files changed, 223 insertions(+), 18 deletions(-)
 create mode 100644 admin-pro-ui/src/gateway/default/Header.tsx
 create mode 100644 admin-pro-ui/src/gateway/index.tsx
 create mode 100644 admin-pro-ui/src/pages/mirco/index.tsx

diff --git a/admin-pro-ui/src/components/flow/components/FlowPage.tsx b/admin-pro-ui/src/components/flow/components/FlowPage.tsx
index 26645cc5..fb0bff4c 100644
--- a/admin-pro-ui/src/components/flow/components/FlowPage.tsx
+++ b/admin-pro-ui/src/components/flow/components/FlowPage.tsx
@@ -7,7 +7,6 @@ import {
     UserSelectFormProps,
     UserSelectFormViewKey
 } from "@/components/flow/types";
-import FlowButton from "@/components/flow/components/FlowButton";
 import {FlowReduxState, updateState} from "@/components/flow/store/FlowSlice";
 import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
 import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
@@ -16,12 +15,12 @@ import {FlowRecordContext} from "@/components/flow/domain/FlowRecordContext";
 import {useDispatch, useSelector} from "react-redux";
 import {FlowEventContext} from "@/components/flow/domain/FlowEventContext";
 import {FlowButtonClickContext} from "@/components/flow/domain/FlowButtonClickContext";
-import {getComponent} from "@/framework/ComponentBus";
 import {FlowViewReactContext} from "../view";
 import FlowResult from "@/components/flow/components/FlowResult";
 import FlowContent from "@/components/flow/components/FlowContent";
 import FlowForm404 from "@/components/flow/components/FlowForm404";
 import FlowHeader from "@/components/flow/components/FlowHeader";
+import ComponentBus from "@/framework/ComponentBus";
 
 
 interface FlowPageProps extends FlowViewProps {
@@ -49,9 +48,9 @@ const FlowPage:React.FC<FlowPageProps> = (props)=>{
     const FlowFormView = flowRecordContext.getFlowFormView() as React.ComponentType<FlowFormViewProps>;
 
     // 延期表单视图
-    const PostponedFormView = getComponent(PostponedFormViewKey) as React.ComponentType<PostponedFormProps>;
+    const PostponedFormView = ComponentBus.getInstance().getComponent<PostponedFormProps>(PostponedFormViewKey);
     // 选人表单视图
-    const UserSelectFormView = getComponent(UserSelectFormViewKey) as React.ComponentType<UserSelectFormProps>;
+    const UserSelectFormView = ComponentBus.getInstance().getComponent<UserSelectFormProps>(UserSelectFormViewKey);
 
     const version = useSelector((state: FlowReduxState) => state.flow.version);
 
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx b/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx
index 0a846722..2da789af 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx
@@ -3,7 +3,7 @@ import {Button, Divider, Space} from "antd";
 import {EyeOutlined, SettingOutlined} from "@ant-design/icons";
 import GroovyScript from "@/components/flow/utils/script";
 import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
-import {getComponent} from "@/framework/ComponentBus";
+import ComponentBus from "@/framework/ComponentBus";
 import ValidateUtils from "@/components/form/utils";
 import FormSelect from "@/components/form/select";
 import FormSwitch from "@/components/form/switch";
@@ -31,7 +31,7 @@ const NodePanel: React.FC<NodePanelProps> = (props) => {
     const [operatorMatcherType, setOperatorMatcherType] = React.useState(props.data?.operatorMatcherType);
 
     // 用户选人视图
-    const UserSelectView = getComponent(UserSelectFormViewKey) as React.ComponentType<UserSelectFormProps>;
+    const UserSelectView = ComponentBus.getInstance().getComponent<UserSelectFormProps>(UserSelectFormViewKey);
 
     return (
         <>
diff --git a/admin-pro-ui/src/components/flow/register/flow.register.tsx b/admin-pro-ui/src/components/flow/register/flow.register.tsx
index e954c10f..13ea4a43 100644
--- a/admin-pro-ui/src/components/flow/register/flow.register.tsx
+++ b/admin-pro-ui/src/components/flow/register/flow.register.tsx
@@ -1,4 +1,4 @@
-import {registerComponent} from "@/framework/ComponentBus";
+import ComponentBus from "@/framework/ComponentBus";
 import PostponedFormView from "@/components/flow/components/PostponedFormView";
 import {
     PostponedFormViewKey,
@@ -6,5 +6,5 @@ import {
 } from "@/components/flow/types";
 import UserSelectView from "@/components/flow/components/UserSelectView";
 
-registerComponent(PostponedFormViewKey, PostponedFormView);
-registerComponent(UserSelectFormViewKey, UserSelectView);
+ComponentBus.getInstance().registerComponent(PostponedFormViewKey, PostponedFormView);
+ComponentBus.getInstance().registerComponent(UserSelectFormViewKey, UserSelectView);
diff --git a/admin-pro-ui/src/config/menus.tsx b/admin-pro-ui/src/config/menus.tsx
index f654d47f..a5dfd64c 100644
--- a/admin-pro-ui/src/config/menus.tsx
+++ b/admin-pro-ui/src/config/menus.tsx
@@ -21,6 +21,12 @@ export const menus = [
         icon: "FormOutlined",
         page: 'form',
     },
+    {
+        path: '/mirco',
+        name: '微前端',
+        icon: "FormOutlined",
+        page: 'mirco',
+    },
     {
         path: '/flow',
         name: '流程',
diff --git a/admin-pro-ui/src/framework/ComponentBus/index.tsx b/admin-pro-ui/src/framework/ComponentBus/index.tsx
index 6d7fbaf7..22528f84 100644
--- a/admin-pro-ui/src/framework/ComponentBus/index.tsx
+++ b/admin-pro-ui/src/framework/ComponentBus/index.tsx
@@ -1,14 +1,78 @@
 import React from "react";
+import {loadRemoteComponent, loadRemoteScript} from "@/utils/dynamicLoader";
 
-const componentBus = new Map<string, React.ComponentType<any>>();
+class ComponentBus {
 
+    private readonly componentBus = new Map<string, React.ComponentType<any>>();
 
-// 注册表操作方法
-export const registerComponent = (name: string, component: React.ComponentType<any>) => {
-    componentBus.set(name, component);
-};
+    /**
+     * 注册组件
+     * @param key 组件key
+     * @param component 组件类型
+     */
+    public registerComponent = (key: string, component: React.ComponentType<any>) => {
+        this.componentBus.set(key, component);
+    }
 
-// 获取组件
-export const getComponent = (name: string): React.ComponentType<any> | undefined => {
-    return componentBus.get(name);
+    /**
+     * 删除组件
+     * @param key  组件key
+     */
+    public removeComponent = (key: string) => {
+        this.componentBus.delete(key);
+    }
+
+    /**
+     * 注册远程组件
+     * @param key 组件key
+     * @param remoteUrl 远程组件地址
+     * @param scope     远程组件作用域
+     * @param module    远程组件名称
+     */
+    public registerRemoteComponent = (key: string, remoteUrl: string, scope: string, module: string): Promise<boolean> => {
+        return new Promise((resolve, reject) => {
+            loadRemoteScript(remoteUrl).then(() => {
+                loadRemoteComponent(scope, module)
+                    .then((ComponentModule: any) => {
+                        const Component = ComponentModule.default || ComponentModule;
+                        this.registerComponent(key, Component);
+                        resolve(true);
+                    }).catch(error => {
+                    reject(error);
+                });
+            }).catch(error => {
+                reject(error);
+            });
+        })
+    }
+
+    /**
+     * 获取组件
+     * @param key 组件key
+     * @param defaultComponent 默认组件
+     */
+    public getComponent = <T extends {} = any>(key: string, defaultComponent?: React.ComponentType<T>): React.ComponentType<T> | undefined => {
+        const component = this.componentBus.get(key) as React.ComponentType<T> | undefined;
+        if (component) {
+            return component;
+        }
+        if (defaultComponent) {
+            return defaultComponent;
+        }
+        return undefined;
+    };
+
+    private ComponentBus() {
+        // 私有构造函数，防止外部实例化
+    }
+
+    private static instance: ComponentBus = new ComponentBus();
+
+    // 单例模式
+    public static getInstance(): ComponentBus {
+        return ComponentBus.instance;
+    }
 }
+
+export default ComponentBus;
+
diff --git a/admin-pro-ui/src/gateway/default/Header.tsx b/admin-pro-ui/src/gateway/default/Header.tsx
new file mode 100644
index 00000000..1d0356ad
--- /dev/null
+++ b/admin-pro-ui/src/gateway/default/Header.tsx
@@ -0,0 +1,17 @@
+import React from "react";
+import {HeaderProps} from "@/gateway";
+
+
+const HeaderDefault: React.FC<HeaderProps> = (props) => {
+    return (
+        <div>
+            <h1>{props.title}</h1>
+            <button onClick={props.onClick}>Click Me</button>
+            <div>
+                <span>PS:local default component</span>
+            </div>
+        </div>
+    )
+}
+
+export default HeaderDefault;
diff --git a/admin-pro-ui/src/gateway/index.tsx b/admin-pro-ui/src/gateway/index.tsx
new file mode 100644
index 00000000..a8fb44d1
--- /dev/null
+++ b/admin-pro-ui/src/gateway/index.tsx
@@ -0,0 +1,6 @@
+
+export interface HeaderProps{
+    title: string;
+    onClick: () => void;
+}
+
diff --git a/admin-pro-ui/src/pages/mirco/index.tsx b/admin-pro-ui/src/pages/mirco/index.tsx
new file mode 100644
index 00000000..38c3b09b
--- /dev/null
+++ b/admin-pro-ui/src/pages/mirco/index.tsx
@@ -0,0 +1,114 @@
+import React, {useState} from "react";
+import {Button, Space} from "antd";
+import ComponentBus from "@/framework/ComponentBus";
+import {HeaderProps} from "@/gateway";
+import HeaderDefault from "@/gateway/default/Header";
+import {ModalForm, ProForm, ProFormText} from "@ant-design/pro-components";
+
+
+const MircoPage = () => {
+
+    // 用于重新渲染界面
+    const [pageVersion, setPageVersion] = useState(0);
+
+    const HeaderKey = "Header";
+    const Header = ComponentBus.getInstance().getComponent<HeaderProps>(HeaderKey, HeaderDefault);
+
+    const [visible, setVisible] = useState(false);
+
+    const [form] = ProForm.useForm();
+
+    const handlerLoadComponent = async (values: any) => {
+        const {remoteUrl, scope, module} = values;
+        ComponentBus.getInstance()
+            .registerRemoteComponent(HeaderKey, remoteUrl, scope, module)
+            .finally(() => {
+                setVisible(false);
+            });
+    }
+
+    return (
+        <>
+            <div style={{
+                textAlign:'center'
+            }}>
+                <Space>
+                    <Button onClick={() => {
+                        form.setFieldsValue({
+                            remoteUrl: "http://localhost:4000/remoteEntry.js",
+                            scope: "MircoApp2",
+                            module: "./Header"
+                        })
+                        setVisible(true);
+                    }}>load remote component</Button>
+
+                    <Button onClick={() => {
+                        ComponentBus.getInstance().removeComponent(HeaderKey);
+                        setPageVersion(Math.random());
+                    }}>remove remote component</Button>
+                </Space>
+            </div>
+
+            <ModalForm
+                title={"load remote component"}
+                open={visible}
+                form={form}
+                modalProps={{
+                    onCancel: () => {
+                        setVisible(false);
+                    },
+                    destroyOnClose: true
+                }}
+                onFinish={handlerLoadComponent}
+            >
+
+
+                <ProFormText
+                    label={"remoteUrl"}
+                    name={"remoteUrl"}
+                    rules={[
+                        {
+                            required: true,
+                            message: "remoteUrl is required"
+                        }
+                    ]}
+                />
+
+                <ProFormText
+                    label={"scope"}
+                    name={"scope"}
+                    rules={[
+                        {
+                            required: true,
+                            message: "scope is required"
+                        }
+                    ]}
+                />
+
+                <ProFormText
+                    label={"module"}
+                    name={"module"}
+                    rules={[
+                        {
+                            required: true,
+                            message: "module is required"
+                        }
+                    ]}
+                />
+
+            </ModalForm>
+
+            {Header && (
+                <Header
+                    title={"Remote Component Header"}
+                    onClick={() => {
+                        alert('click');
+                    }}
+                />
+            )}
+
+        </>
+    )
+}
+
+export default MircoPage;
diff --git a/admin-pro-ui/src/pages/welcome/index.tsx b/admin-pro-ui/src/pages/welcome/index.tsx
index 35cc0da6..5bf4fca0 100644
--- a/admin-pro-ui/src/pages/welcome/index.tsx
+++ b/admin-pro-ui/src/pages/welcome/index.tsx
@@ -14,7 +14,6 @@ const WelcomePage = () => {
             <ul>3. 管理权限</ul>
             <ul>4. 动态菜单</ul>
             <ul>5. 动态加载组件</ul>
-
         </PageContainer>
     );
 }

From 41b4dc001d59db31661f117e5ce592ed09ee355f Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Fri, 25 Apr 2025 09:31:02 +0800
Subject: [PATCH 10/20] add mirco component bus

---
 mobile-ui/package.json                        |   1 +
 .../components/flow/components/FlowPage.tsx   |   6 +-
 .../src/components/flow/register/index.tsx    |   6 +-
 .../src/framework/ComponentBus/index.tsx      |  80 +++++++++++--
 mobile-ui/src/utils/base64.ts                 |  27 +++++
 mobile-ui/src/utils/dynamicLoader.ts          | 108 ++++++++++++++++++
 6 files changed, 214 insertions(+), 14 deletions(-)
 create mode 100644 mobile-ui/src/utils/base64.ts
 create mode 100644 mobile-ui/src/utils/dynamicLoader.ts

diff --git a/mobile-ui/package.json b/mobile-ui/package.json
index 44acb0bd..eea4365b 100644
--- a/mobile-ui/package.json
+++ b/mobile-ui/package.json
@@ -17,6 +17,7 @@
     "base64-js": "^1.5.1",
     "cross-env": "^7.0.3",
     "dayjs": "^1.11.13",
+    "jszip": "^3.10.1",
     "lodash": "^4.17.21",
     "moment": "^2.30.1",
     "monaco-editor": "^0.51.0",
diff --git a/mobile-ui/src/components/flow/components/FlowPage.tsx b/mobile-ui/src/components/flow/components/FlowPage.tsx
index acf4c9c5..36a8edc6 100644
--- a/mobile-ui/src/components/flow/components/FlowPage.tsx
+++ b/mobile-ui/src/components/flow/components/FlowPage.tsx
@@ -18,7 +18,7 @@ import FlowContent from "@/components/flow/components/FlowContent";
 import FlowFooter from "@/components/flow/components/FlowFooter";
 import {FlowViewReactContext} from "@/components/flow/view";
 import FlowForm404 from "@/components/flow/components/FlowForm404";
-import {getComponent} from "@/framework/ComponentBus";
+import ComponentBus from "@/framework/ComponentBus";
 import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
 import {FlowButtonClickContext} from "@/components/flow/domain/FlowButtonClickContext";
 
@@ -48,9 +48,9 @@ const FlowPage: React.FC<FlowPageProps> = (props) => {
     const FlowFormView = flowRecordContext.getFlowFormView() as React.ComponentType<FlowFormViewProps>;
 
     // 延期表单视图
-    const PostponedFormView = getComponent(PostponedFormViewKey) as React.ComponentType<PostponedFormProps>;
+    const PostponedFormView = ComponentBus.getInstance().getComponent<PostponedFormProps>(PostponedFormViewKey);
     // 选人表单视图
-    const UserSelectFormView = getComponent(UserSelectFormViewKey) as React.ComponentType<UserSelectFormProps>;
+    const UserSelectFormView = ComponentBus.getInstance().getComponent<UserSelectFormProps>(UserSelectFormViewKey);
 
     const version = useSelector((state: FlowReduxState) => state.flow.version);
 
diff --git a/mobile-ui/src/components/flow/register/index.tsx b/mobile-ui/src/components/flow/register/index.tsx
index 35686332..c629f6bd 100644
--- a/mobile-ui/src/components/flow/register/index.tsx
+++ b/mobile-ui/src/components/flow/register/index.tsx
@@ -1,8 +1,8 @@
-import {registerComponent} from "@/framework/ComponentBus";
+import ComponentBus from "@/framework/ComponentBus";
 import {PostponedFormViewKey, UserSelectFormViewKey} from "@/components/flow/types";
 import PostponedFormView from "@/components/flow/plugins/PostponedFormView";
 import UserSelectFormView from "@/components/flow/plugins/UserSelectFormView";
 
-registerComponent(PostponedFormViewKey, PostponedFormView);
-registerComponent(UserSelectFormViewKey, UserSelectFormView);
+ComponentBus.getInstance().registerComponent(PostponedFormViewKey, PostponedFormView);
+ComponentBus.getInstance().registerComponent(UserSelectFormViewKey, UserSelectFormView);
 
diff --git a/mobile-ui/src/framework/ComponentBus/index.tsx b/mobile-ui/src/framework/ComponentBus/index.tsx
index 6d7fbaf7..22528f84 100644
--- a/mobile-ui/src/framework/ComponentBus/index.tsx
+++ b/mobile-ui/src/framework/ComponentBus/index.tsx
@@ -1,14 +1,78 @@
 import React from "react";
+import {loadRemoteComponent, loadRemoteScript} from "@/utils/dynamicLoader";
 
-const componentBus = new Map<string, React.ComponentType<any>>();
+class ComponentBus {
 
+    private readonly componentBus = new Map<string, React.ComponentType<any>>();
 
-// 注册表操作方法
-export const registerComponent = (name: string, component: React.ComponentType<any>) => {
-    componentBus.set(name, component);
-};
+    /**
+     * 注册组件
+     * @param key 组件key
+     * @param component 组件类型
+     */
+    public registerComponent = (key: string, component: React.ComponentType<any>) => {
+        this.componentBus.set(key, component);
+    }
 
-// 获取组件
-export const getComponent = (name: string): React.ComponentType<any> | undefined => {
-    return componentBus.get(name);
+    /**
+     * 删除组件
+     * @param key  组件key
+     */
+    public removeComponent = (key: string) => {
+        this.componentBus.delete(key);
+    }
+
+    /**
+     * 注册远程组件
+     * @param key 组件key
+     * @param remoteUrl 远程组件地址
+     * @param scope     远程组件作用域
+     * @param module    远程组件名称
+     */
+    public registerRemoteComponent = (key: string, remoteUrl: string, scope: string, module: string): Promise<boolean> => {
+        return new Promise((resolve, reject) => {
+            loadRemoteScript(remoteUrl).then(() => {
+                loadRemoteComponent(scope, module)
+                    .then((ComponentModule: any) => {
+                        const Component = ComponentModule.default || ComponentModule;
+                        this.registerComponent(key, Component);
+                        resolve(true);
+                    }).catch(error => {
+                    reject(error);
+                });
+            }).catch(error => {
+                reject(error);
+            });
+        })
+    }
+
+    /**
+     * 获取组件
+     * @param key 组件key
+     * @param defaultComponent 默认组件
+     */
+    public getComponent = <T extends {} = any>(key: string, defaultComponent?: React.ComponentType<T>): React.ComponentType<T> | undefined => {
+        const component = this.componentBus.get(key) as React.ComponentType<T> | undefined;
+        if (component) {
+            return component;
+        }
+        if (defaultComponent) {
+            return defaultComponent;
+        }
+        return undefined;
+    };
+
+    private ComponentBus() {
+        // 私有构造函数，防止外部实例化
+    }
+
+    private static instance: ComponentBus = new ComponentBus();
+
+    // 单例模式
+    public static getInstance(): ComponentBus {
+        return ComponentBus.instance;
+    }
 }
+
+export default ComponentBus;
+
diff --git a/mobile-ui/src/utils/base64.ts b/mobile-ui/src/utils/base64.ts
new file mode 100644
index 00000000..bb10d6fa
--- /dev/null
+++ b/mobile-ui/src/utils/base64.ts
@@ -0,0 +1,27 @@
+
+export const rcFileToBase64 = (file: any): Promise<string> => {
+    return new Promise((resolve, reject) => {
+        const reader = new FileReader();
+        reader.readAsDataURL(file);
+        reader.onload = () => resolve(reader.result as string);
+        reader.onerror = error => reject(error);
+    });
+}
+
+
+export const base64ToBlob = (base64: string, type: string) => {
+    const binStr = atob(base64.split(',')[1]);
+    const len = binStr.length;
+    const arr = new Uint8Array(len);
+    for (let i = 0; i < len; i++) {
+        arr[i] = binStr.charCodeAt(i);
+    }
+    return new Blob([arr], {type: type});
+}
+
+export const base64ToString = (base64: string) => {
+    if (base64.indexOf('base64') !== -1) {
+        base64 = base64.split(',')[1];
+    }
+    return atob(base64);
+}
diff --git a/mobile-ui/src/utils/dynamicLoader.ts b/mobile-ui/src/utils/dynamicLoader.ts
new file mode 100644
index 00000000..f26908e2
--- /dev/null
+++ b/mobile-ui/src/utils/dynamicLoader.ts
@@ -0,0 +1,108 @@
+import JSZip from "jszip";
+import {base64ToBlob} from "@/utils/base64";
+
+export const loadRemoteComponent = (scope: string, module: string) => {
+    return new Promise(async (resolve, reject) => {
+        try {
+            // Initialize the sharing scope (shared modules like react, etc.)
+            //@ts-ignore
+            await __webpack_init_sharing__('default');
+            //@ts-ignore
+            const container = window[scope]; // Get the container loaded on the window object
+            if (!container) {
+                reject(new Error(`Remote scope ${scope} not found on window.`));
+                return;
+            }
+
+            //@ts-ignore
+            await container.init(__webpack_share_scopes__.default); // Initialize the container
+            const factory = await container.get(module); // Get the module factory
+            resolve(factory()); // Get the actual module
+        } catch (e) {
+            reject(e);
+        }
+    });
+};
+
+export const loadRemoteScript = (url: string): Promise<void> => {
+    return new Promise((resolve, reject) => {
+        try {
+            const script = document.createElement('script');
+            script.src = url;
+            script.onload = (e) => {
+                resolve();
+            };
+            script.onerror = reject;
+            document.head.appendChild(script);
+        } catch (e) {
+            reject(e);
+        }
+    });
+};
+
+
+export const loadFileScript = (content: string): Promise<void> => {
+    return new Promise((resolve, reject) => {
+        try {
+            try {
+                eval(content);
+            } catch (e) {
+                resolve();
+                return;
+            }
+            const encoder = new TextEncoder();
+            const encodedContent = encoder.encode(content);
+            const blob = new Blob([encodedContent], {type: 'application/javascript'});
+            const url = URL.createObjectURL(blob);
+            const script = document.createElement('script');
+            script.src = url;
+            script.onload = () => {
+                resolve();
+            };
+            script.onerror = (e) => {
+                reject(e);
+            };
+            document.head.appendChild(script);
+        } catch (e) {
+            reject(e);
+        }
+    });
+};
+
+
+export const loadZipJsFileScript = async (base64: string): Promise<void> => {
+    return new Promise((resolve, reject) => {
+        const file = base64ToBlob(base64, 'application/zip');
+        if (file) {
+            const zip = new JSZip();
+            const content = file.arrayBuffer();
+            zip.loadAsync(content).then((unzipped:any) => {
+                const jsFiles: { relativePath: string, content: string }[] = [];
+
+                const filePromises: Promise<void>[] = [];
+                unzipped.forEach((relativePath:any, file:any) => {
+                    if (relativePath.endsWith(".js")) {
+                        const filePromise = file.async('text').then((text:any) => {
+                            jsFiles.push({relativePath, content: text});
+                        });
+                        filePromises.push(filePromise);
+                    }
+                });
+
+                Promise.all(filePromises).then(() => {
+                    jsFiles.reduce((prevPromise: any, jsFile) => {
+                        return prevPromise.then(() => {
+                            return loadFileScript(jsFile.content).then(() => {
+                                console.log('Load success file:', jsFile.relativePath);
+                            });
+                        });
+                    }, Promise.resolve()).then(() => {
+                        resolve();
+                    }).catch(reject);
+                }).catch(reject);
+            }).catch(reject);
+        } else {
+            reject(new Error('Failed to convert base64 to Blob.'));
+        }
+    });
+};

From b57afb169948e493848c2c7b169f4fdbe0d8d790 Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Fri, 25 Apr 2025 09:37:27 +0800
Subject: [PATCH 11/20] add mirco component bus

---
 admin-pro-ui/src/pages/mirco/index.tsx | 10 +++++++---
 admin-pro-ui/webpack.config.dev.js     |  2 +-
 admin-pro-ui/webpack.config.mock.js    |  2 +-
 admin-pro-ui/webpack.config.prod.js    |  2 +-
 4 files changed, 10 insertions(+), 6 deletions(-)

diff --git a/admin-pro-ui/src/pages/mirco/index.tsx b/admin-pro-ui/src/pages/mirco/index.tsx
index 38c3b09b..b62af029 100644
--- a/admin-pro-ui/src/pages/mirco/index.tsx
+++ b/admin-pro-ui/src/pages/mirco/index.tsx
@@ -1,5 +1,5 @@
 import React, {useState} from "react";
-import {Button, Space} from "antd";
+import {Button, message, Space} from "antd";
 import ComponentBus from "@/framework/ComponentBus";
 import {HeaderProps} from "@/gateway";
 import HeaderDefault from "@/gateway/default/Header";
@@ -22,6 +22,10 @@ const MircoPage = () => {
         const {remoteUrl, scope, module} = values;
         ComponentBus.getInstance()
             .registerRemoteComponent(HeaderKey, remoteUrl, scope, module)
+            .catch(error=>{
+                console.error("load remote component error", error);
+                message.error('load remote component error');
+            })
             .finally(() => {
                 setVisible(false);
             });
@@ -35,8 +39,8 @@ const MircoPage = () => {
                 <Space>
                     <Button onClick={() => {
                         form.setFieldsValue({
-                            remoteUrl: "http://localhost:4000/remoteEntry.js",
-                            scope: "MircoApp2",
+                            remoteUrl: "http://localhost:3000/remoteEntry.js",
+                            scope: "MircoApp",
                             module: "./Header"
                         })
                         setVisible(true);
diff --git a/admin-pro-ui/webpack.config.dev.js b/admin-pro-ui/webpack.config.dev.js
index 60b77fdb..2ac3919e 100644
--- a/admin-pro-ui/webpack.config.dev.js
+++ b/admin-pro-ui/webpack.config.dev.js
@@ -4,7 +4,7 @@ const common = require('./webpack.common.js');
 module.exports = merge(common, {
     mode: 'development',
     devServer: {
-        port: 3000,
+        port: 8000,
 
         proxy: [
             {
diff --git a/admin-pro-ui/webpack.config.mock.js b/admin-pro-ui/webpack.config.mock.js
index d53c66ae..1998dc09 100644
--- a/admin-pro-ui/webpack.config.mock.js
+++ b/admin-pro-ui/webpack.config.mock.js
@@ -7,7 +7,7 @@ const express = require('express');
 module.exports = merge(common, {
     mode: 'development',
     devServer: {
-        port: 3000,
+        port: 8000,
 
         setupMiddlewares: (middlewares, devServer) => {
             if (!devServer) {
diff --git a/admin-pro-ui/webpack.config.prod.js b/admin-pro-ui/webpack.config.prod.js
index 90868278..3e2d47c5 100644
--- a/admin-pro-ui/webpack.config.prod.js
+++ b/admin-pro-ui/webpack.config.prod.js
@@ -4,6 +4,6 @@ const common = require('./webpack.common.js');
 module.exports = merge(common,{
     mode: 'production',
     devServer: {
-        port: 13000,
+        port: 8000,
     },
 });

From f497e5a56e023a4c74bc09b9f2ccbf68265d7199 Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Fri, 25 Apr 2025 09:40:57 +0800
Subject: [PATCH 12/20] fix refreshPage

---
 admin-pro-ui/src/pages/mirco/index.tsx | 7 ++++++-
 1 file changed, 6 insertions(+), 1 deletion(-)

diff --git a/admin-pro-ui/src/pages/mirco/index.tsx b/admin-pro-ui/src/pages/mirco/index.tsx
index b62af029..9b304ac9 100644
--- a/admin-pro-ui/src/pages/mirco/index.tsx
+++ b/admin-pro-ui/src/pages/mirco/index.tsx
@@ -18,6 +18,10 @@ const MircoPage = () => {
 
     const [form] = ProForm.useForm();
 
+    const refreshPage = ()=>{
+        setPageVersion(Math.random());
+    }
+
     const handlerLoadComponent = async (values: any) => {
         const {remoteUrl, scope, module} = values;
         ComponentBus.getInstance()
@@ -28,6 +32,7 @@ const MircoPage = () => {
             })
             .finally(() => {
                 setVisible(false);
+                refreshPage();
             });
     }
 
@@ -48,7 +53,7 @@ const MircoPage = () => {
 
                     <Button onClick={() => {
                         ComponentBus.getInstance().removeComponent(HeaderKey);
-                        setPageVersion(Math.random());
+                        refreshPage();
                     }}>remove remote component</Button>
                 </Space>
             </div>

From f2bc1646591a903810402242d9a6deeb9654515a Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Sun, 27 Apr 2025 20:41:42 +0800
Subject: [PATCH 13/20] remove form

---
 admin-pro-ui/package.json                     |   3 +-
 .../src/components/CodeEditor/index.tsx       | 145 --------
 .../src/components/descriptions/index.tsx     |   6 +-
 .../flow/components/FlowFormOpinion.tsx       |   2 +-
 .../flow/components/FlowHistory.tsx           |   2 +-
 .../components/flow/components/FlowPage.tsx   |   4 +-
 .../flow/domain/FlowEventContext.ts           |   2 +-
 .../flow/nodes/panel/ButtonPanel.tsx          |   7 +-
 .../components/flow/nodes/panel/EdgePanel.tsx |   4 +-
 .../components/flow/nodes/panel/NodePanel.tsx |   9 +-
 .../flow/nodes/panel/ScriptModal.tsx          |   6 +-
 .../components/flow/nodes/panel/circulate.tsx |   2 +-
 .../src/components/flow/nodes/panel/node.tsx  |   2 +-
 .../src/components/flow/nodes/panel/over.tsx  |   2 +-
 .../src/components/flow/nodes/panel/start.tsx |   2 +-
 admin-pro-ui/src/components/flow/types.ts     |   3 +-
 .../src/components/flow/view/index.tsx        |   2 +-
 admin-pro-ui/src/components/form/captcha.tsx  |  75 -----
 admin-pro-ui/src/components/form/cascader.tsx | 100 ------
 admin-pro-ui/src/components/form/checkbox.tsx |  81 -----
 admin-pro-ui/src/components/form/code.tsx     |  40 ---
 admin-pro-ui/src/components/form/color.tsx    |  66 ----
 admin-pro-ui/src/components/form/common.tsx   |  41 ---
 admin-pro-ui/src/components/form/date.tsx     | 136 --------
 .../components/form/domain/FormInstance.tsx   | 314 ------------------
 admin-pro-ui/src/components/form/factory.tsx  | 183 ----------
 admin-pro-ui/src/components/form/form.scss    |  16 -
 admin-pro-ui/src/components/form/index.tsx    | 133 --------
 admin-pro-ui/src/components/form/input.tsx    |  39 ---
 admin-pro-ui/src/components/form/listener.ts  |  64 ----
 admin-pro-ui/src/components/form/password.tsx |  38 ---
 admin-pro-ui/src/components/form/radio.tsx    |  60 ----
 admin-pro-ui/src/components/form/rate.tsx     |  33 --
 admin-pro-ui/src/components/form/select.tsx   | 104 ------
 admin-pro-ui/src/components/form/selector.tsx |  12 -
 admin-pro-ui/src/components/form/slider.tsx   |  46 ---
 admin-pro-ui/src/components/form/stepper.tsx  |  42 ---
 admin-pro-ui/src/components/form/switch.tsx   |  44 ---
 admin-pro-ui/src/components/form/textarea.tsx |  37 ---
 admin-pro-ui/src/components/form/types.tsx    | 190 -----------
 admin-pro-ui/src/components/form/uploder.tsx  | 171 ----------
 admin-pro-ui/src/components/form/utils.ts     |  30 --
 admin-pro-ui/src/components/form/validate.ts  |  92 -----
 .../src/framework/ComponentBus/index.tsx      |  78 -----
 admin-pro-ui/src/framework/EventBus/index.ts  |  58 ----
 .../src/pages/flow/leave/LeaveForm.tsx        |   6 +-
 admin-pro-ui/src/pages/flow/user/index.tsx    |   6 +-
 admin-pro-ui/src/pages/flow/work/index.tsx    |   7 +-
 admin-pro-ui/src/pages/form/index.tsx         |  47 +--
 admin-pro-ui/src/pages/mirco/index.tsx        |  12 +-
 50 files changed, 61 insertions(+), 2543 deletions(-)
 delete mode 100644 admin-pro-ui/src/components/CodeEditor/index.tsx
 delete mode 100644 admin-pro-ui/src/components/form/captcha.tsx
 delete mode 100644 admin-pro-ui/src/components/form/cascader.tsx
 delete mode 100644 admin-pro-ui/src/components/form/checkbox.tsx
 delete mode 100644 admin-pro-ui/src/components/form/code.tsx
 delete mode 100644 admin-pro-ui/src/components/form/color.tsx
 delete mode 100644 admin-pro-ui/src/components/form/common.tsx
 delete mode 100644 admin-pro-ui/src/components/form/date.tsx
 delete mode 100644 admin-pro-ui/src/components/form/domain/FormInstance.tsx
 delete mode 100644 admin-pro-ui/src/components/form/factory.tsx
 delete mode 100644 admin-pro-ui/src/components/form/form.scss
 delete mode 100644 admin-pro-ui/src/components/form/index.tsx
 delete mode 100644 admin-pro-ui/src/components/form/input.tsx
 delete mode 100644 admin-pro-ui/src/components/form/listener.ts
 delete mode 100644 admin-pro-ui/src/components/form/password.tsx
 delete mode 100644 admin-pro-ui/src/components/form/radio.tsx
 delete mode 100644 admin-pro-ui/src/components/form/rate.tsx
 delete mode 100644 admin-pro-ui/src/components/form/select.tsx
 delete mode 100644 admin-pro-ui/src/components/form/selector.tsx
 delete mode 100644 admin-pro-ui/src/components/form/slider.tsx
 delete mode 100644 admin-pro-ui/src/components/form/stepper.tsx
 delete mode 100644 admin-pro-ui/src/components/form/switch.tsx
 delete mode 100644 admin-pro-ui/src/components/form/textarea.tsx
 delete mode 100644 admin-pro-ui/src/components/form/types.tsx
 delete mode 100644 admin-pro-ui/src/components/form/uploder.tsx
 delete mode 100644 admin-pro-ui/src/components/form/utils.ts
 delete mode 100644 admin-pro-ui/src/components/form/validate.ts
 delete mode 100644 admin-pro-ui/src/framework/ComponentBus/index.tsx
 delete mode 100644 admin-pro-ui/src/framework/EventBus/index.ts

diff --git a/admin-pro-ui/package.json b/admin-pro-ui/package.json
index e3ae9c08..b181b121 100644
--- a/admin-pro-ui/package.json
+++ b/admin-pro-ui/package.json
@@ -7,6 +7,8 @@
     "@ant-design/icons": "^5.4.0",
     "@ant-design/pro-components": "^2.8.2",
     "@babel/standalone": "^7.25.6",
+    "@codingapi/form-pc": "^0.0.15",
+    "@codingapi/ui-framework": "^0.0.12",
     "@dnd-kit/core": "^6.2.0",
     "@dnd-kit/sortable": "^9.0.0",
     "@handsontable/react-wrapper": "^15.0.0",
@@ -25,7 +27,6 @@
     "jszip": "^3.10.1",
     "lodash": "^4.17.21",
     "moment": "^2.30.1",
-    "monaco-editor": "^0.51.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
     "react-markdown": "^10.0.0",
diff --git a/admin-pro-ui/src/components/CodeEditor/index.tsx b/admin-pro-ui/src/components/CodeEditor/index.tsx
deleted file mode 100644
index 6a146eac..00000000
--- a/admin-pro-ui/src/components/CodeEditor/index.tsx
+++ /dev/null
@@ -1,145 +0,0 @@
-import React, {Ref, useEffect, useImperativeHandle} from 'react';
-import * as monaco from 'monaco-editor';
-
-export interface CodeEditorAction {
-    // 重置编辑器的值
-    resetValue: (value: string) => void;
-    // 获取选中的值
-    getSelectedValue: () => string;
-    // 获取编辑器的值
-    getValue: () => string;
-    // 获取编辑器实例
-    getEditor:() => monaco.editor.IStandaloneCodeEditor | null;
-}
-
-
-interface CodeEditorProps {
-    language?: string,
-    value?: string,
-    onChange?: (value: string) => void,
-    onSelectedRun?: (value: string) => void;
-    style?: React.CSSProperties;
-    readonly?: boolean;
-    theme?: string;
-    fontSize?: number;
-    actionRef?: Ref<CodeEditorAction>;
-}
-
-
-const CodeEditor: React.FC<CodeEditorProps> = (props) => {
-    const language = props.language || 'javascript';
-    const theme = props.theme || "vs-dark";
-    const fontSize = props.fontSize || 14;
-    const [editorId, setEditorId] = React.useState<string>("");
-
-    const container = React.useRef(null);
-
-    const style = props.style || {
-        height: "80px",
-    }
-
-    const codeEditorAction = {
-        getEditor: ()=>{
-            const editors =  monaco.editor.getEditors();
-            if(editors.length > 0) {
-                return editors.find(editor => editor.getId() === editorId);
-            }
-            return null;
-        },
-
-        resetValue: (value: string) => {
-            const editor = codeEditorAction.getEditor();
-            if(editor) {
-                const position = editor.getPosition();
-                editor.setValue(value);
-                if (position) {
-                    editor.setPosition({
-                        lineNumber: position.lineNumber,
-                        column: position.column
-                    });
-                }
-            }
-        },
-        getSelectedValue: () => {
-            const editor = codeEditorAction.getEditor();
-            if(editor) {
-                const selection = editor.getSelection();
-                //@ts-ignore
-                return editor.getModel().getValueInRange(selection);
-            }
-            return "";
-        },
-        getValue: () => {
-            const editor = codeEditorAction.getEditor();
-            if(editor) {
-                return editor.getValue();
-            }
-            return "";
-        }
-    } as CodeEditorAction;
-
-    useImperativeHandle(props.actionRef, () => (codeEditorAction), [props.actionRef]);
-
-    useEffect(() => {
-        if(props.value) {
-            codeEditorAction.resetValue(props.value);
-        }
-    }, [props.value]);
-
-    useEffect(() => {
-        const model = monaco.editor.createModel(props.value || "", language);
-        const editor = monaco.editor.create(
-            //@ts-ignore
-            container?.current,
-            {
-                automaticLayout: true,
-                model: model,
-                fontSize: fontSize,
-                theme: theme,
-                readOnly: props.readonly,
-            },
-        );
-
-        setEditorId(editor.getId());
-
-        const subscription = editor.onDidChangeModelContent((event) => {
-            props.onChange && props.onChange(editor.getValue());
-        });
-
-        let runSelectedCodeActionDispose: monaco.IDisposable | null = null;
-        if (props.onSelectedRun) {
-            const runSelectedCodeAction = {
-                id: "run-code",
-                label: "Run Selected Code",
-                contextMenuGroupId: "navigation",
-                keybindings: [
-                    monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyR,
-                    monaco.KeyMod.WinCtrl | monaco.KeyCode.KeyR,
-                ],
-                run: () => {
-                    const selection = editor.getSelection();
-                    //@ts-ignore
-                    const selectedText = editor.getModel().getValueInRange(selection);
-                    props.onSelectedRun && props.onSelectedRun(selectedText);
-                },
-            }
-            runSelectedCodeActionDispose = monaco.editor.addEditorAction(runSelectedCodeAction);
-        }
-
-        return () => {
-            editor.dispose();
-            subscription.dispose();
-            model.dispose();
-
-            if (runSelectedCodeActionDispose !== null) {
-                runSelectedCodeActionDispose.dispose();
-            }
-        };
-    }, [props.readonly]);
-
-    return (
-        <div ref={container} style={style}></div>
-    );
-};
-
-export default CodeEditor;
diff --git a/admin-pro-ui/src/components/descriptions/index.tsx b/admin-pro-ui/src/components/descriptions/index.tsx
index f32d86ce..8e2c7427 100644
--- a/admin-pro-ui/src/components/descriptions/index.tsx
+++ b/admin-pro-ui/src/components/descriptions/index.tsx
@@ -1,5 +1,5 @@
 import React, {useEffect, useImperativeHandle} from "react";
-import {FormField} from "@/components/form/types";
+import {FormField} from "@codingapi/ui-framework";
 import "./index.scss";
 
 export interface DescriptionsAction {
@@ -36,7 +36,7 @@ const Descriptions: React.FC<DescriptionsProps> = (props) => {
                     props.columns?.map(item => {
                         promise.push(new Promise<any>((resolve, reject) => {
                             props.dataConvert?.(item, data).then(value => {
-                                data[item.props.name] = value;
+                                data[item.props.name as string] = value;
                                 resolve(value);
                             }).catch(reject);
                         }));
@@ -73,7 +73,7 @@ const Descriptions: React.FC<DescriptionsProps> = (props) => {
                 .map((item) => {
                     const key = item.props.name;
                     const label = item.props.label as string || "";
-                    const value = data[key];
+                    const value = data[key as string];
                     const valueType = typeof value === 'object' ? 'object' : 'string';
                     return (
                         <div className={"descriptions-list-item"}>
diff --git a/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx b/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx
index 08e25d8c..b9fcbba0 100644
--- a/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx
+++ b/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx
@@ -1,5 +1,5 @@
 import React, {useContext, useEffect} from "react";
-import Form from "@/components/form";
+import {Form} from "@codingapi/form-pc";
 import {FlowViewReactContext} from "@/components/flow/view";
 
 const FlowFormOpinion = ()=>{
diff --git a/admin-pro-ui/src/components/flow/components/FlowHistory.tsx b/admin-pro-ui/src/components/flow/components/FlowHistory.tsx
index c81b8533..445efa37 100644
--- a/admin-pro-ui/src/components/flow/components/FlowHistory.tsx
+++ b/admin-pro-ui/src/components/flow/components/FlowHistory.tsx
@@ -1,7 +1,7 @@
 import React, {useContext} from "react";
 import {FlowViewReactContext} from "@/components/flow/view";
 import Descriptions from "@/components/descriptions";
-import {FormField} from "@/components/form/types";
+import {FormField} from "@codingapi/ui-framework";
 import moment from "moment";
 import {Tag} from "antd";
 
diff --git a/admin-pro-ui/src/components/flow/components/FlowPage.tsx b/admin-pro-ui/src/components/flow/components/FlowPage.tsx
index fb0bff4c..c53b249d 100644
--- a/admin-pro-ui/src/components/flow/components/FlowPage.tsx
+++ b/admin-pro-ui/src/components/flow/components/FlowPage.tsx
@@ -10,7 +10,7 @@ import {
 import {FlowReduxState, updateState} from "@/components/flow/store/FlowSlice";
 import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
 import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
-import Form from "@/components/form";
+import {Form} from "@codingapi/form-pc";
 import {FlowRecordContext} from "@/components/flow/domain/FlowRecordContext";
 import {useDispatch, useSelector} from "react-redux";
 import {FlowEventContext} from "@/components/flow/domain/FlowEventContext";
@@ -20,7 +20,7 @@ import FlowResult from "@/components/flow/components/FlowResult";
 import FlowContent from "@/components/flow/components/FlowContent";
 import FlowForm404 from "@/components/flow/components/FlowForm404";
 import FlowHeader from "@/components/flow/components/FlowHeader";
-import ComponentBus from "@/framework/ComponentBus";
+import {ComponentBus} from "@codingapi/ui-framework";
 
 
 interface FlowPageProps extends FlowViewProps {
diff --git a/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts b/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts
index 715e5412..73e5088f 100644
--- a/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts
+++ b/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts
@@ -5,7 +5,7 @@ import {FlowUser} from "@/components/flow/types";
 import {FlowSubmitResultParser} from "@/components/flow/domain/FlowResultParser";
 import {UserSelectMode} from "@/components/flow/store/FlowSlice";
 import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
-import FormInstance from "@/components/form/domain/FormInstance";
+import {FormInstance} from "@codingapi/ui-framework";
 
 /**
  * 流程的事件控制上下文对象
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx b/admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx
index dfac4cc5..c8affa8f 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx
@@ -4,11 +4,8 @@ import {Button, ColorPicker, Modal, Popconfirm, Space} from "antd";
 import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
 import {EyeOutlined} from "@ant-design/icons";
 import FlowContext from "@/components/flow/domain/FlowContext";
-import FormInput from "@/components/form/input";
-import ValidateUtils from "@/components/form/utils";
-import FormSelect from "@/components/form/select";
-import FormColor from "@/components/form/color";
-import Form from "@/components/form";
+import {Form,FormInput,FormSelect,FormColor} from "@codingapi/form-pc";
+import {ValidateUtils} from "@codingapi/ui-framework";
 
 interface ButtonPanelProps {
     id: string;
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx b/admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx
index 553f6342..14b0cf1f 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx
@@ -1,10 +1,10 @@
 import React from "react";
-import {ActionType, ProForm, ProTable} from "@ant-design/pro-components";
+import {ActionType, ProTable} from "@ant-design/pro-components";
 import {Input, InputNumber, Popconfirm, Space} from "antd";
 import {CheckOutlined, EditOutlined, SettingOutlined} from "@ant-design/icons";
 import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
 import FlowContext from "@/components/flow/domain/FlowContext";
-import Form from "@/components/form";
+import {Form} from "@codingapi/form-pc";
 
 interface EdgePanelProps {
     id?: string;
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx b/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx
index 2da789af..57e7f80c 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx
@@ -3,14 +3,9 @@ import {Button, Divider, Space} from "antd";
 import {EyeOutlined, SettingOutlined} from "@ant-design/icons";
 import GroovyScript from "@/components/flow/utils/script";
 import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
-import ComponentBus from "@/framework/ComponentBus";
-import ValidateUtils from "@/components/form/utils";
-import FormSelect from "@/components/form/select";
-import FormSwitch from "@/components/form/switch";
-import FormInput from "@/components/form/input";
+import {ValidateUtils,ComponentBus,FormInstance} from "@codingapi/ui-framework";
+import {FormSelect,FormSwitch,FormInput,Form} from "@codingapi/form-pc";
 import {UserSelectFormProps, UserSelectFormViewKey} from "@/components/flow/types";
-import FormInstance from "@/components/form/domain/FormInstance";
-import Form from "@/components/form";
 
 interface NodePanelProps {
     id?: string,
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.tsx b/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.tsx
index 253b2e86..ae68961e 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.tsx
@@ -2,12 +2,10 @@ import React from "react";
 import Markdown from "react-markdown";
 import {markdown} from "@/components/flow/nodes/panel/help";
 import remarkGfm from 'remark-gfm'
-import FormInput from "@/components/form/input";
-import FormCode from "@/components/form/code";
 import "./ScriptModal.scss";
-import FormInstance from "@/components/form/domain/FormInstance";
+import {FormInstance} from "@codingapi/ui-framework";
 import {Modal} from "antd";
-import Form from "@/components/form";
+import {Form,FormInput,FormCode} from "@codingapi/form-pc";
 
 interface ScriptModalProps {
     form: FormInstance;
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/circulate.tsx b/admin-pro-ui/src/components/flow/nodes/panel/circulate.tsx
index ff135049..8c3dedff 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/circulate.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/circulate.tsx
@@ -3,7 +3,7 @@ import {Button, Drawer, Space, Tabs} from "antd";
 import NodePanel from "@/components/flow/nodes/panel/NodePanel";
 import EdgePanel from "@/components/flow/nodes/panel/EdgePanel";
 import {SettingPanelProps} from "@/components/flow/types";
-import Form from "@/components/form";
+import {Form} from "@codingapi/form-pc";
 
 const CirculateSettingPanel: React.FC<SettingPanelProps> = (props) => {
 
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/node.tsx b/admin-pro-ui/src/components/flow/nodes/panel/node.tsx
index 06358d54..9a77173a 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/node.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/node.tsx
@@ -4,7 +4,7 @@ import NodePanel from "@/components/flow/nodes/panel/NodePanel";
 import EdgePanel from "@/components/flow/nodes/panel/EdgePanel";
 import ButtonPanel from "@/components/flow/nodes/panel/ButtonPanel";
 import {SettingPanelProps} from "@/components/flow/types";
-import Form from "@/components/form";
+import {Form} from "@codingapi/form-pc";
 
 
 const NodeSettingPanel: React.FC<SettingPanelProps> = (props) => {
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/over.tsx b/admin-pro-ui/src/components/flow/nodes/panel/over.tsx
index 4eda3772..2e3f2969 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/over.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/over.tsx
@@ -2,7 +2,7 @@ import React from "react";
 import {Button, Drawer, Space} from "antd";
 import NodePanel from "@/components/flow/nodes/panel/NodePanel";
 import {SettingPanelProps} from "@/components/flow/types";
-import Form from "@/components/form";
+import {Form} from "@codingapi/form-pc";
 
 const OverSettingPanel: React.FC<SettingPanelProps> = (props) => {
 
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/start.tsx b/admin-pro-ui/src/components/flow/nodes/panel/start.tsx
index 2fa1a79c..b2adec36 100644
--- a/admin-pro-ui/src/components/flow/nodes/panel/start.tsx
+++ b/admin-pro-ui/src/components/flow/nodes/panel/start.tsx
@@ -4,7 +4,7 @@ import EdgePanel from "@/components/flow/nodes/panel/EdgePanel";
 import NodePanel from "@/components/flow/nodes/panel/NodePanel";
 import ButtonPanel from "@/components/flow/nodes/panel/ButtonPanel";
 import {SettingPanelProps} from "@/components/flow/types";
-import Form from "@/components/form";
+import {Form} from "@codingapi/form-pc";
 
 const StartSettingPanel: React.FC<SettingPanelProps> = (props) => {
 
diff --git a/admin-pro-ui/src/components/flow/types.ts b/admin-pro-ui/src/components/flow/types.ts
index 0b0521c8..3c1bc2d6 100644
--- a/admin-pro-ui/src/components/flow/types.ts
+++ b/admin-pro-ui/src/components/flow/types.ts
@@ -1,5 +1,4 @@
-// 节点状态
-import FormInstance from "@/components/form/domain/FormInstance";
+import {FormInstance} from "@codingapi/ui-framework";
 
 export type NodeState = "done" | "wait" | "undone" | "current";
 
diff --git a/admin-pro-ui/src/components/flow/view/index.tsx b/admin-pro-ui/src/components/flow/view/index.tsx
index 01eec8f1..9539ba0b 100644
--- a/admin-pro-ui/src/components/flow/view/index.tsx
+++ b/admin-pro-ui/src/components/flow/view/index.tsx
@@ -1,6 +1,6 @@
 import React, {createContext, useEffect} from "react";
 import {FlowViewProps} from "@/components/flow/types";
-import FormInstance from "@/components/form/domain/FormInstance";
+import {FormInstance} from "@codingapi/ui-framework";
 import {FlowButtonClickContext} from "@/components/flow/domain/FlowButtonClickContext";
 import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
 import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
diff --git a/admin-pro-ui/src/components/form/captcha.tsx b/admin-pro-ui/src/components/form/captcha.tsx
deleted file mode 100644
index 85380115..00000000
--- a/admin-pro-ui/src/components/form/captcha.tsx
+++ /dev/null
@@ -1,75 +0,0 @@
-import React, {useEffect, useState} from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Input} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-
-const Captcha:React.FC<FormItemProps> = (props)=>{
-
-    const [captchaImg, setCaptchaImg] = useState<string>('');
-    const {formContext} = formFieldInit(props);
-
-    const reloadCaptcha = () => {
-        props.onCaptchaRefresh && props.onCaptchaRefresh().then((res) => {
-            if(res) {
-                setCaptchaImg(res.url);
-                props.onCaptchaChange && props.onCaptchaChange(res.code);
-            }
-        });
-    }
-
-    useEffect(() => {
-        reloadCaptcha();
-    }, [])
-
-    return (
-        <div className={"form-captcha"}>
-            <Input
-                className={"form-captcha-input"}
-                disabled={props.disabled}
-                value={props.value}
-                addonAfter={props.addonAfter}
-                addonBefore={props.addonBefore}
-                prefix={props.prefix}
-                suffix={props.suffix}
-                placeholder={props.placeholder}
-                onChange={(value) => {
-                    const currentValue = value.target.value;
-                    formContext?.setFieldValue(props.name, currentValue);
-                    props.onChange && props.onChange(currentValue,formContext);
-                }}
-            />
-
-            <img
-                className={"form-captcha-img"}
-                onClick={() => {
-                    reloadCaptcha();
-                }}
-                src={captchaImg}
-                alt="点击重置"
-            />
-        </div>
-    )
-}
-
-
-const FormCaptcha: React.FC<FormItemProps> = (props) => {
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            required={props.required}
-            hidden={props.hidden}
-            help={props.help}
-            tooltip={props.tooltip}
-        >
-            <Captcha
-                {...props}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormCaptcha;
diff --git a/admin-pro-ui/src/components/form/cascader.tsx b/admin-pro-ui/src/components/form/cascader.tsx
deleted file mode 100644
index 027a3697..00000000
--- a/admin-pro-ui/src/components/form/cascader.tsx
+++ /dev/null
@@ -1,100 +0,0 @@
-import React, {useEffect} from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Cascader, Form, Space} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-const valueToForm = (value: string) => {
-    if (value && value.length > 0) {
-        return value.split(",");
-    }
-    return value;
-}
-
-const formToValue = (value: string[]) => {
-    if (value && value.length > 0) {
-        return value.join(",")
-    }
-    return value;
-}
-
-interface $CascaderProps extends FormItemProps{
-    formInstance?:FormInstance;
-}
-
-const $Cascader:React.FC<$CascaderProps> = (props)=>{
-    const formInstance = props.formInstance;
-    return (
-       <Space.Compact
-           style={{
-               width:"100%"
-           }}
-       >
-           {props.addonBefore}
-           <Cascader
-               disabled={props.disabled}
-               value={props.value}
-               suffixIcon={props.suffix}
-               prefix={props.prefix}
-               options={props.options}
-               onChange={(value) => {
-                   formInstance?.setFieldValue(props.name, formToValue(value as string[]));
-                   props.onChange && props.onChange(value, formInstance);
-               }}
-           />
-           {props.addonAfter}
-       </Space.Compact>
-    )
-}
-
-const FormCascader: React.FC<FormItemProps> = (props) => {
-
-    const [options, setOptions] = React.useState(props.options);
-
-    const {formContext} = formFieldInit(props, () => {
-        reloadOptions();
-    });
-
-    const reloadOptions = () => {
-        if (props.loadOptions) {
-            props.loadOptions(formContext).then(res => {
-                setOptions(res);
-            });
-        }
-    }
-
-    useEffect(() => {
-        reloadOptions();
-    }, []);
-
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            required={props.required}
-            hidden={props.hidden}
-            help={props.help}
-            tooltip={props.tooltip}
-
-            getValueProps={(value) => {
-                if (value) {
-                    return {
-                        value: valueToForm(value)
-                    }
-                }
-                return value
-            }}
-        >
-            <$Cascader
-                {...props}
-                options={options}
-                formInstance={formContext}
-            />
-
-        </Form.Item>
-    )
-}
-
-export default FormCascader;
diff --git a/admin-pro-ui/src/components/form/checkbox.tsx b/admin-pro-ui/src/components/form/checkbox.tsx
deleted file mode 100644
index 7f361453..00000000
--- a/admin-pro-ui/src/components/form/checkbox.tsx
+++ /dev/null
@@ -1,81 +0,0 @@
-import React, {useEffect} from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Checkbox, Form, Space} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const valueToForm = (value: string) => {
-    if (value && value.length > 0) {
-        return value.split(",");
-    }
-    return value;
-}
-
-const formToValue = (value: string[]) => {
-    if (value && value.length > 0) {
-        return value.join(",")
-    }
-    return value;
-}
-
-const FormCheckbox: React.FC<FormItemProps> = (props) => {
-    const [options, setOptions] = React.useState(props.options);
-
-    const {formContext} = formFieldInit(props, () => {
-        reloadOptions();
-    });
-
-    const reloadOptions = () => {
-        if (props.loadOptions) {
-            props.loadOptions(formContext).then(res => {
-                setOptions(res);
-            });
-        }
-    }
-
-    useEffect(() => {
-        reloadOptions();
-    }, []);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            required={props.required}
-            hidden={props.hidden}
-            help={props.help}
-            tooltip={props.tooltip}
-            getValueProps={(value) => {
-                if (value) {
-                    return {
-                        value: valueToForm(value)
-                    }
-                }
-                return value
-            }}
-        >
-            <Checkbox.Group
-                disabled={props.disabled}
-                value={props.value}
-                onChange={(e) => {
-                    formContext?.setFieldValue(props.name, formToValue(e as string[]));
-                    props.onChange && props.onChange(e, formContext)
-                }}
-            >
-                <Space direction={props.checkboxDirection}>
-                    {options?.map((item,index) => {
-                        return (
-                            <Checkbox
-                                key={index}
-                                disabled={item.disable}
-                                value={item.value}
-                            >{item.label}</Checkbox>
-                        )
-                    })}
-                </Space>
-            </Checkbox.Group>
-        </Form.Item>
-    )
-}
-
-export default FormCheckbox;
diff --git a/admin-pro-ui/src/components/form/code.tsx b/admin-pro-ui/src/components/form/code.tsx
deleted file mode 100644
index 7aad7307..00000000
--- a/admin-pro-ui/src/components/form/code.tsx
+++ /dev/null
@@ -1,40 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-import CodeEditor from "@/components/CodeEditor";
-
-
-const FormCode: React.FC<FormItemProps> = (props) => {
-
-    const {formContext} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            hidden={props.hidden}
-            help={props.help}
-            required={props.required}
-            tooltip={props.tooltip}
-        >
-            <CodeEditor
-                readonly={props.disabled}
-                value={props.value}
-                onChange={(value) => {
-                    formContext?.setFieldValue(props.name, value);
-                    props.onChange && props.onChange(value, formContext);
-                }}
-                theme={props.codeTheme}
-                language={props.codeLanguage}
-                fontSize={props.codeFontSize}
-                style={props.codeStyle}
-                actionRef={props.codeActionRef}
-                onSelectedRun={props.onCodeSelectedRun}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormCode;
diff --git a/admin-pro-ui/src/components/form/color.tsx b/admin-pro-ui/src/components/form/color.tsx
deleted file mode 100644
index a70fad47..00000000
--- a/admin-pro-ui/src/components/form/color.tsx
+++ /dev/null
@@ -1,66 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {ColorPicker, Form, Space} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-import type {AggregationColor} from "antd/es/color-picker/color";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-const formToValue = (value: AggregationColor) => {
-    if (value) {
-        return value.toHexString();
-    }
-    return value;
-}
-
-interface $ColorPickerProps extends FormItemProps{
-    formInstance?:FormInstance;
-}
-
-const $ColorPicker:React.FC<$ColorPickerProps> = (props)=>{
-    const formInstance = props.formInstance;
-
-    return (
-       <Space.Compact
-           style={{
-               width:"100%"
-           }}
-       >
-           {props.addonBefore}
-           <ColorPicker
-               disabled={props.disabled}
-               value={props.value}
-               onChange={(value) => {
-                   const currentValue = formToValue(value);
-                   formInstance?.setFieldValue(props.name, currentValue);
-                   props.onChange && props.onChange(currentValue, formInstance);
-               }}
-           />
-           {props.addonAfter}
-       </Space.Compact>
-    )
-}
-
-const FormColor: React.FC<FormItemProps> = (props) => {
-
-    const {formContext} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            hidden={props.hidden}
-            help={props.help}
-            required={props.required}
-            tooltip={props.tooltip}
-        >
-            <$ColorPicker
-                {...props}
-                formInstance={formContext}
-            />
-
-        </Form.Item>
-    )
-}
-
-export default FormColor;
diff --git a/admin-pro-ui/src/components/form/common.tsx b/admin-pro-ui/src/components/form/common.tsx
deleted file mode 100644
index 14cf8d55..00000000
--- a/admin-pro-ui/src/components/form/common.tsx
+++ /dev/null
@@ -1,41 +0,0 @@
-import React, {useEffect} from "react";
-import {FormContext} from "@/components/form";
-import {FormItemProps} from "@/components/form/types";
-
-const formFieldInit = (props: FormItemProps,reloadOption?:()=>void) => {
-    const formContext = React.useContext(FormContext) || undefined;
-    const formAction = formContext?.getFormAction();
-    const validateContext = formContext?.getFormValidateContext();
-    const [random, setRandom] = React.useState(0);
-
-    useEffect(() => {
-        if (props.validateFunction) {
-            if (validateContext) {
-                if (props.disabled || props.hidden) {
-                    // do nothing
-                } else {
-                    validateContext.addValidateFunction(props.name, props.validateFunction);
-                }
-            }
-        }
-        const reloadContext = formContext?.getFormFieldReloadListenerContext();
-        if (reloadContext) {
-            reloadContext.addListener(props.name, () => {
-                setRandom(Math.random);
-            });
-        }
-
-        const optionContext = formContext?.getFormFieldOptionListenerContext();
-        if (optionContext) {
-            optionContext.addListener(props.name, () => {
-                if(reloadOption){
-                    reloadOption();
-                }
-            });
-        }
-    }, [formContext]);
-
-    return {formContext, validateContext};
-}
-
-export default formFieldInit;
diff --git a/admin-pro-ui/src/components/form/date.tsx b/admin-pro-ui/src/components/form/date.tsx
deleted file mode 100644
index e5d86a7a..00000000
--- a/admin-pro-ui/src/components/form/date.tsx
+++ /dev/null
@@ -1,136 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {DatePicker, Form, Space} from "antd";
-import dayjs from "dayjs";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-const datePrecisionConverter = (precision?: string) => {
-    if (precision === "day") {
-        return "date";
-    }
-    if (precision === "year") {
-        return "year";
-    }
-    if (precision === "month") {
-        return "month";
-    }
-    if (precision === "week") {
-        return "week";
-    }
-    if (precision === "quarter") {
-        return "quarter";
-    }
-    if (precision === "week-day") {
-        return "week";
-    }
-
-    if (precision === "hour") {
-        return "date";
-    }
-
-    if (precision === "minute") {
-        return "date";
-    }
-
-    if (precision === "second") {
-        return "date";
-    }
-
-    return null;
-}
-
-const showTime = (precision?: string) => {
-    if (precision === "hour") {
-        return {
-            format: 'HH'
-        }
-    }
-
-    if (precision === "minute") {
-        return {
-            format: 'HH:mm'
-        }
-    }
-
-    if (precision === "second") {
-        return {
-            format: 'HH:mm:ss'
-        }
-    }
-
-    return null;
-}
-
-interface $DatePicker extends FormItemProps{
-    formInstance?:FormInstance;
-}
-
-const $DatePicker:React.FC<$DatePicker> = (props)=>{
-
-    const formInstance = props.formInstance;
-
-    const format = props.dateFormat || 'YYYY-MM-DD';
-    const precision = datePrecisionConverter(props.datePrecision) || "date";
-    const showTimeConfig = showTime(props.datePrecision);
-
-    return (
-      <Space.Compact
-          style={{
-              width:"100%"
-          }}
-      >
-          {props.addonBefore}
-          <DatePicker
-              style={{
-                  width:"100%"
-              }}
-              disabled={props.disabled}
-              value={props.value}
-              prefix={props.prefix}
-              suffixIcon={props.suffix}
-              picker={precision}
-              showTime={showTimeConfig?{format: showTimeConfig.format}:false}
-              onChange={(date, dateString) => {
-                  const currentDate = dayjs(date).format(format);
-                  formInstance?.setFieldValue(props.name, currentDate);
-                  props.onChange && props.onChange(currentDate, formInstance);
-              }}
-          />
-          {props.addonAfter}
-      </Space.Compact>
-    )
-}
-
-const FormDate: React.FC<FormItemProps> = (props) => {
-
-    const {formContext} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            hidden={props.hidden}
-            help={props.help}
-            required={props.required}
-            tooltip={props.tooltip}
-            getValueProps={(value) => {
-                if (value) {
-                    return {
-                        value: dayjs(value)
-                    }
-                }
-                return value;
-            }}
-        >
-            <$DatePicker
-                {...props}
-                formInstance={formContext}
-            />
-
-        </Form.Item>
-    )
-}
-
-export default FormDate;
diff --git a/admin-pro-ui/src/components/form/domain/FormInstance.tsx b/admin-pro-ui/src/components/form/domain/FormInstance.tsx
deleted file mode 100644
index b1d0e433..00000000
--- a/admin-pro-ui/src/components/form/domain/FormInstance.tsx
+++ /dev/null
@@ -1,314 +0,0 @@
-import {FormValidateContext} from "@/components/form/validate";
-import {FormFieldOptionListenerContext, FormFieldReloadListenerContext} from "@/components/form/listener";
-import {NamePath} from "rc-field-form/es/interface";
-import {FormField} from "@/components/form/types";
-import {Form as AntdForm} from "antd";
-import {FiledData, FormAction} from "@/components/form";
-import {FormInstance as AntdFormInstance} from "antd/es/form/hooks/useForm";
-import React from "react";
-
-class FormInstance {
-    private readonly validateContext: FormValidateContext;
-    private readonly reloadContext: FormFieldReloadListenerContext;
-    private readonly optionContext: FormFieldOptionListenerContext;
-    private readonly formInstance: AntdFormInstance;
-    private readonly formAction: FormAction;
-    private fields: FormField[];
-
-    private fieldsUpdateDispatch: React.Dispatch<React.SetStateAction<FormField[]>> | undefined;
-
-    public setFieldsUpdateDispatch = (fieldsUpdateDispatch: React.Dispatch<React.SetStateAction<FormField[]>>) => {
-        this.fieldsUpdateDispatch = fieldsUpdateDispatch;
-    }
-
-    private updateFields = (resetFields: (prevState: FormField[]) => FormField[]) => {
-        this.fields = resetFields(this.fields);
-        if (this.fieldsUpdateDispatch) {
-            this.fieldsUpdateDispatch(resetFields);
-        }
-    }
-
-    private namePathEqual = (name1: NamePath, name2: NamePath) => {
-        if (Array.isArray(name1) && Array.isArray(name2)) {
-            if (name1.length !== name2.length) {
-                return false;
-            }
-            for (let i = 0; i < name1.length; i++) {
-                if (name1[i] !== name2[i]) {
-                    return false;
-                }
-            }
-            return true;
-        }
-        return name1 === name2;
-    }
-
-    public submit = async () => {
-        const res = await this.validateContext.validate(this);
-        if (res) {
-            this.formInstance.submit();
-        }
-    }
-
-    public reset = (values?: any) => {
-        this.formInstance.resetFields();
-        if (values) {
-            this.formInstance.setFieldsValue(values);
-            this.reloadContext.notifyAll();
-        }
-    }
-
-    public hidden = (name: NamePath) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            if (this.namePathEqual(field.props.name, name)) {
-                return {
-                    ...field,
-                    props: {
-                        ...field.props,
-                        hidden: true,
-                        required: false
-                    }
-                }
-            }
-            return field;
-        }));
-        this.validateContext.clear();
-    }
-
-    public required = (name: NamePath, required: boolean) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            if (this.namePathEqual(field.props.name, name)) {
-                return {
-                    ...field,
-                    props: {
-                        ...field.props,
-                        required: required
-                    }
-                }
-            }
-            return field;
-        }));
-        this.validateContext.clear();
-    }
-
-    public show = (name: NamePath) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            if (this.namePathEqual(field.props.name, name)) {
-                return {
-                    ...field,
-                    props: {
-                        ...field.props,
-                        hidden: false
-                    }
-                }
-            }
-            return field;
-        }));
-        this.validateContext.clear();
-    }
-
-    public disable = (name: NamePath) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            if (this.namePathEqual(field.props.name, name)) {
-                return {
-                    ...field,
-                    props: {
-                        ...field.props,
-                        disabled: true
-                    }
-                }
-            }
-            return field;
-        }));
-        this.validateContext.clear();
-    }
-
-    public disableAll = () => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            return {
-                ...field,
-                props: {
-                    ...field.props,
-                    disabled: true
-                }
-            }
-        }));
-        this.validateContext.clear();
-    }
-
-    public enable = (name: NamePath) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            if (this.namePathEqual(field.props.name, name)) {
-                return {
-                    ...field,
-                    props: {
-                        ...field.props,
-                        disabled: false
-                    }
-                }
-            }
-            return field;
-        }));
-        this.validateContext.clear();
-    }
-
-    public enableAll = () => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            return {
-                ...field,
-                props: {
-                    ...field.props,
-                    disabled: false
-                }
-            }
-        }));
-        this.validateContext.clear();
-    }
-
-    public remove = (name: NamePath) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.filter((field) => !this.namePathEqual(field.props.name, name)));
-        this.validateContext.clear();
-    }
-
-    public create = (field: FormField, index?: number) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => {
-            const filteredFields = prevFields.filter((item) => item.props.name !== field.props.name);
-            if (index === undefined || index < 0) {
-                return [...filteredFields, field];
-            } else {
-                const newFields = [...filteredFields];
-                newFields.splice(index, 0, field);
-                return newFields;
-            }
-        });
-        this.validateContext.clear();
-    }
-
-    public getFieldValue = (name: NamePath) => {
-        return this.formInstance.getFieldValue(name);
-    }
-
-    public getFieldsValue = () => {
-        return this.formInstance.getFieldsValue();
-    }
-
-    public getFieldProps = (name: NamePath) => {
-        for (const field of this.fields) {
-            if (this.namePathEqual(field.props.name, name)) {
-                return field;
-            }
-        }
-        return null;
-    }
-
-    public reloadOptions = (name: NamePath) => {
-        this.optionContext.notify(name);
-    }
-
-    public reloadAllOptions = () => {
-        this.optionContext.notifyAll();
-    }
-
-    public setFieldValue = (name: NamePath, value: any) => {
-        this.formInstance.setFieldValue(name, value);
-        this.reloadContext.notify(name);
-        this.validateContext?.validateField(name, this);
-    }
-
-    public setFieldsValue = (values: any) => {
-        this.formInstance.setFieldsValue(values);
-        this.reloadContext.notifyAll();
-    }
-
-    public setFields = (fields: FiledData[]) => {
-        this.formInstance.setFields(fields);
-    }
-
-    public validate = () => {
-        return this.validateContext.validate(this);
-    }
-
-    public resetFields = (fields: FormField[]) => {
-        this.fields = fields;
-    }
-
-    constructor() {
-        this.validateContext = new FormValidateContext();
-        this.reloadContext = new FormFieldReloadListenerContext();
-        this.optionContext = new FormFieldOptionListenerContext();
-        this.formInstance = AntdForm.useForm()[0];
-        this.fields = [];
-        this.formAction = {
-            submit: this.submit,
-            reset: this.reset,
-            hidden: this.hidden,
-            show: this.show,
-            remove: this.remove,
-            create: this.create,
-            disable: this.disable,
-            disableAll: this.disableAll,
-            enable: this.enable,
-            enableAll: this.enableAll,
-            required: this.required,
-            getFieldValue: this.getFieldValue,
-            getFieldsValue: this.getFieldsValue,
-            getFieldProps: this.getFieldProps,
-            reloadOptions: this.reloadOptions,
-            reloadAllOptions: this.reloadAllOptions,
-            setFieldValue: this.setFieldValue,
-            setFieldsValue: this.setFieldsValue,
-            setFields: this.setFields,
-            validate: this.validate,
-        }
-    }
-
-    public getFormAction = () => {
-        return this.formAction;
-    }
-
-    public getFormValidateContext = () => {
-        return this.validateContext;
-    }
-
-    public getFormFieldReloadListenerContext = () => {
-        return this.reloadContext;
-    }
-
-    public getFormFieldOptionListenerContext = () => {
-        return this.optionContext;
-    }
-
-    public getFormControlInstance = (): AntdFormInstance => {
-        return this.formInstance;
-    }
-
-}
-
-export default FormInstance;
diff --git a/admin-pro-ui/src/components/form/factory.tsx b/admin-pro-ui/src/components/form/factory.tsx
deleted file mode 100644
index 17abf4e3..00000000
--- a/admin-pro-ui/src/components/form/factory.tsx
+++ /dev/null
@@ -1,183 +0,0 @@
-import React from "react";
-import {FormField} from "@/components/form/types";
-import FormInput from "@/components/form/input";
-import FormPassword from "@/components/form/password";
-import FormCaptcha from "@/components/form/captcha";
-import FormCheckbox from "@/components/form/checkbox";
-import FormRadio from "@/components/form/radio";
-import FormRate from "@/components/form/rate";
-import FormSlider from "@/components/form/slider";
-import FormStepper from "@/components/form/stepper";
-import FormTextArea from "@/components/form/textarea";
-import FormSwitch from "@/components/form/switch";
-import FormDate from "@/components/form/date";
-import FormCascader from "@/components/form/cascader";
-import FormSelect from "@/components/form/select";
-import FormSelector from "@/components/form/selector";
-import FormUploader from "@/components/form/uploder";
-import FormColor from "@/components/form/color";
-import FormCode from "@/components/form/code";
-
-
-class FormFactory {
-
-    static create = (field: FormField) => {
-        const type = field.type;
-        const props = field.props;
-
-        if (type === 'input') {
-            return (
-                <FormInput
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'password') {
-            return (
-                <FormPassword
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'captcha') {
-            return (
-                <FormCaptcha
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'checkbox') {
-            return (
-                <FormCheckbox
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'radio') {
-            return (
-                <FormRadio
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'rate') {
-            return (
-                <FormRate
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'slider') {
-            return (
-                <FormSlider
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-        if (type === 'stepper') {
-            return (
-                <FormStepper
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'textarea') {
-            return (
-                <FormTextArea
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'switch') {
-            return (
-                <FormSwitch
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'date') {
-            return (
-                <FormDate
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'cascader') {
-            return (
-                <FormCascader
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'selector') {
-            return (
-                <FormSelector
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'select') {
-            return (
-                <FormSelect
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'uploader') {
-            return (
-                <FormUploader
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'color') {
-            return (
-                <FormColor
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'code') {
-            return (
-                <FormCode
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-    }
-
-}
-
-export default FormFactory;
diff --git a/admin-pro-ui/src/components/form/form.scss b/admin-pro-ui/src/components/form/form.scss
deleted file mode 100644
index 0b8c49ff..00000000
--- a/admin-pro-ui/src/components/form/form.scss
+++ /dev/null
@@ -1,16 +0,0 @@
-@use "@/config/variables" as *;
-
-.form-captcha {
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-
-  .form-captcha-input {
-  }
-
-  .form-captcha-img {
-    margin-left: 10px;
-    cursor: pointer;
-    height: 30px;
-  }
-}
diff --git a/admin-pro-ui/src/components/form/index.tsx b/admin-pro-ui/src/components/form/index.tsx
deleted file mode 100644
index ced2b758..00000000
--- a/admin-pro-ui/src/components/form/index.tsx
+++ /dev/null
@@ -1,133 +0,0 @@
-import React, {useEffect} from "react";
-import {NamePath} from "rc-field-form/es/interface";
-import {FormField} from "@/components/form/types";
-import {Form as AntForm} from "antd";
-import FormFactory from "@/components/form/factory";
-import "./form.scss";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-export interface FiledData {
-    name: NamePath;
-    errors?: string[];
-}
-
-export interface FormAction {
-    // 提交表单，提取之前会先校验表单
-    submit: () => void;
-    // 重置表单，恢复表单项最初的状态
-    reset: (values?: any) => void;
-    // 隐藏表单项，隐藏后的表单项不会显示在表单中，但是值会被提交
-    hidden: (name: NamePath) => void;
-    // 展示表单项，展示后的表单项会显示在表单中，值也会被提交
-    show: (name: NamePath) => void;
-    // 删除表单项，删除后的表单项不会显示在表单中，值也不会被提交，在fields配置的情况下生效
-    remove: (name: NamePath) => void;
-    // 添加表单项，添加后的表单项会显示在表单中，值也会被提交，在fields配置的情况下生效
-    create: (field: FormField, index?: number) => void;
-    // 禁用表单项，禁用后的表单项还会被提交
-    disable: (name: NamePath) => void;
-    // 全部禁用，禁用后的表单项还会被提交
-    disableAll: () => void;
-    // 启用表单项，启用后的表单项还会被提交
-    enable: (name: NamePath) => void;
-    // 全部启用，启用后的表单项还会被提交
-    enableAll: () => void;
-    // 必填选项控制,true为必填false为非必填提示
-    required: (name: NamePath, required: boolean) => void;
-    // 获取字段的值
-    getFieldValue: (name: NamePath) => any;
-    // 重新加载选项
-    reloadOptions: (name: NamePath) => any;
-    // 重新加载所有选项
-    reloadAllOptions: () => any;
-    // 获取全部字段的值
-    getFieldsValue: () => any;
-    // 设置字段的值
-    setFieldValue: (name: NamePath, value: any) => void;
-    // 设置全部字段的值
-    setFieldsValue: (values: any) => void;
-    // 设置Field字段
-    setFields: (fields: FiledData[]) => void;
-    // 获取Field属性
-    getFieldProps: (name: NamePath) => FormField | null;
-    // 校验表单
-    validate: () => Promise<boolean>;
-}
-
-export interface FormProps {
-    // 表单字段
-    loadFields?: () => Promise<FormField[]>;
-    // 表单提交事件
-    onFinish?: (values: any) => Promise<void>;
-    // form布局，默认vertical
-    layout?: 'horizontal' | 'vertical';
-    // children元素
-    children?: React.ReactNode;
-    // footer元素
-    footer?: React.ReactNode;
-    // 初始化值
-    initialValues?: any;
-    // 表单实例
-    form?: FormInstance;
-}
-
-export const FormContext = React.createContext<FormInstance | null>(null);
-
-
-const FormComponent: React.FC<FormProps> = (props) => {
-
-    const formInstance = props.form? props.form : new FormInstance();
-
-    const [fields, setFields] = React.useState<FormField[]>([]);
-    formInstance.setFieldsUpdateDispatch(setFields);
-
-    const formControl = formInstance.getFormControlInstance();
-
-    const reloadFields = () => {
-        if (props.loadFields) {
-            props.loadFields().then(fields => {
-                setFields(fields);
-                formInstance.resetFields(fields);
-            })
-        }
-    }
-
-    useEffect(() => {
-        reloadFields();
-    }, [props.loadFields]);
-
-    return (
-        <FormContext.Provider
-            value={formInstance}
-        >
-            <AntForm
-                form={formControl}
-                onFinish={(values) => {
-                    props.onFinish && props.onFinish(values);
-                }}
-                initialValues={props.initialValues}
-                layout={props.layout}
-            >
-                {fields.length > 0 && fields.map((field) => {
-                    return FormFactory.create(field) as React.ReactNode;
-                })}
-
-                {props.children}
-
-                {props.footer}
-            </AntForm>
-        </FormContext.Provider>
-    )
-}
-
-type FormType = typeof FormComponent;
-type FormComponentType = FormType & {
-    useForm: ()=>FormInstance;
-};
-
-const Form = FormComponent as FormComponentType;
-Form.useForm = ()=>{
-    return new FormInstance();
-};
-
-export default Form;
diff --git a/admin-pro-ui/src/components/form/input.tsx b/admin-pro-ui/src/components/form/input.tsx
deleted file mode 100644
index 7b1327ce..00000000
--- a/admin-pro-ui/src/components/form/input.tsx
+++ /dev/null
@@ -1,39 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Input} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormInput: React.FC<FormItemProps> = (props) => {
-
-    const inputType = props.inputType || "text";
-    const {formContext} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            hidden={props.hidden}
-            help={props.help}
-            required={props.required}
-            tooltip={props.tooltip}
-        >
-            <Input
-                disabled={props.disabled}
-                value={props.value}
-                type={inputType}
-                placeholder={props.placeholder}
-                maxLength={props.inputMaxLength}
-                addonAfter={props.addonAfter}
-                addonBefore={props.addonBefore}
-                onChange={(value) => {
-                    const currentValue = value.target.value;
-                    formContext?.setFieldValue(props.name, currentValue);
-                    props.onChange && props.onChange(currentValue, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormInput;
diff --git a/admin-pro-ui/src/components/form/listener.ts b/admin-pro-ui/src/components/form/listener.ts
deleted file mode 100644
index 8b0277b8..00000000
--- a/admin-pro-ui/src/components/form/listener.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-import {NamePath} from "rc-field-form/es/interface";
-
-// Form字段组件刷新控制监听上下文对象
-export class FormFieldReloadListenerContext {
-
-    private readonly map:Map<string,()=>void>;
-
-    constructor() {
-        this.map = new Map();
-    }
-
-    public addListener(name:NamePath,listener:()=>void){
-        const key = Array.isArray(name)?name.join("."):name;
-        this.map.set(key, listener);
-    }
-
-
-    public notify(name:NamePath){
-        const key = Array.isArray(name)?name.join("."):name;
-        const listener = this.map.get(key);
-        if(listener){
-            listener();
-        }
-    }
-
-    public notifyAll(){
-        this.map.forEach(listener=>{
-            listener();
-        })
-    }
-
-}
-
-// Form字段组件选项刷新控制监听上下文对象
-export class FormFieldOptionListenerContext {
-
-    private readonly map:Map<string,()=>void>;
-
-    constructor() {
-        this.map = new Map();
-    }
-
-    public addListener(name:NamePath,listener:()=>void){
-        const key = Array.isArray(name)?name.join("."):name;
-        this.map.set(key, listener);
-    }
-
-
-    public notify(name:NamePath){
-        const key = Array.isArray(name)?name.join("."):name;
-        const listener = this.map.get(key);
-        if(listener){
-            listener();
-        }
-    }
-
-    public notifyAll(){
-        this.map.forEach(listener=>{
-            listener();
-        })
-    }
-
-}
-
diff --git a/admin-pro-ui/src/components/form/password.tsx b/admin-pro-ui/src/components/form/password.tsx
deleted file mode 100644
index 9aafa524..00000000
--- a/admin-pro-ui/src/components/form/password.tsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Input} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormPassword: React.FC<FormItemProps> = (props) => {
-
-    const {formContext} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            hidden={props.hidden}
-            help={props.help}
-            required={props.required}
-            tooltip={props.tooltip}
-        >
-            <Input.Password
-                disabled={props.disabled}
-                value={props.value}
-                addonAfter={props.addonAfter}
-                addonBefore={props.addonBefore}
-                prefix={props.prefix}
-                suffix={props.suffix}
-                placeholder={props.placeholder}
-                onChange={(value) => {
-                    const currentValue = value.target.value;
-                    formContext?.setFieldValue(props.name, currentValue);
-                    props.onChange && props.onChange(currentValue, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormPassword;
diff --git a/admin-pro-ui/src/components/form/radio.tsx b/admin-pro-ui/src/components/form/radio.tsx
deleted file mode 100644
index af39e893..00000000
--- a/admin-pro-ui/src/components/form/radio.tsx
+++ /dev/null
@@ -1,60 +0,0 @@
-import React, {useEffect} from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Radio, Space} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormRadio: React.FC<FormItemProps> = (props) => {
-    const [options, setOptions] = React.useState(props.options);
-
-    const {formContext} = formFieldInit(props, () => {
-        reloadOptions();
-    });
-
-    const reloadOptions = () => {
-        if (props.loadOptions) {
-            props.loadOptions(formContext).then(res => {
-                setOptions(res);
-            });
-        }
-    }
-
-    useEffect(() => {
-        reloadOptions();
-    }, []);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            hidden={props.hidden}
-            help={props.help}
-            required={props.required}
-            tooltip={props.tooltip}
-        >
-            <Radio.Group
-                disabled={props.disabled}
-                value={props.value}
-                onChange={(value) => {
-                    const currentValue = value.target.value;
-                    formContext?.setFieldValue(props.name, currentValue);
-                    props.onChange && props.onChange(currentValue, formContext);
-                }}
-            >
-                <Space direction={props.radioDirection}>
-                    {options?.map((item,index) => {
-                        return (
-                            <Radio
-                                key={index}
-                                value={item.value}
-                                disabled={item.disable}
-                            >{item.label}</Radio>
-                        )
-                    })}
-                </Space>
-            </Radio.Group>
-        </Form.Item>
-    )
-}
-
-export default FormRadio;
diff --git a/admin-pro-ui/src/components/form/rate.tsx b/admin-pro-ui/src/components/form/rate.tsx
deleted file mode 100644
index 446eb8f7..00000000
--- a/admin-pro-ui/src/components/form/rate.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Rate} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormRate: React.FC<FormItemProps> = (props) => {
-    const {formContext} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            hidden={props.hidden}
-            help={props.help}
-            required={props.required}
-            tooltip={props.tooltip}
-        >
-            <Rate
-                disabled={props.disabled}
-                count={props.rateCount}
-                allowHalf={props.rateAllowHalf}
-                value={props.value}
-                onChange={(value) => {
-                    formContext?.setFieldValue(props.name, value);
-                    props.onChange && props.onChange(value, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormRate;
diff --git a/admin-pro-ui/src/components/form/select.tsx b/admin-pro-ui/src/components/form/select.tsx
deleted file mode 100644
index 9cfc271d..00000000
--- a/admin-pro-ui/src/components/form/select.tsx
+++ /dev/null
@@ -1,104 +0,0 @@
-import React, {useEffect} from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Select, Space} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-const valueToForm = (value: string) => {
-    if (value && value.length > 0) {
-        return value.split(",");
-    }
-    return value;
-}
-
-const formToValue = (value: string[] |string) => {
-    if(value instanceof Array) {
-        if (value && value.length > 0) {
-            return value.join(",")
-        }
-    }
-    return value;
-}
-
-interface $SelectProps extends FormItemProps{
-    formInstance?:FormInstance;
-}
-
-const $Select: React.FC<$SelectProps> = (props) => {
-    const formInstance = props.formInstance;
-
-    return (
-        <Space.Compact
-            style={{
-                width:"100%"
-            }}
-        >
-            {props.addonBefore}
-            <Select
-                prefix={props.prefix}
-                suffixIcon={props.suffix}
-                disabled={props.disabled}
-                value={props.value}
-                mode={props.selectMultiple ? "multiple" : undefined}
-                placeholder={props.placeholder}
-                showSearch={true}
-                options={props.options}
-                onChange={(value,option) => {
-                    formInstance?.setFieldValue(props.name, formToValue(value as string[]));
-                    props.onChange && props.onChange(value, formInstance);
-                }}
-            />
-            {props.addonAfter}
-        </Space.Compact>
-    )
-}
-
-const FormSelect: React.FC<FormItemProps> = (props) => {
-
-    const [options, setOptions] = React.useState(props.options);
-
-    const {formContext} = formFieldInit(props, () => {
-        reloadOptions();
-    });
-
-    const reloadOptions = () => {
-        if (props.loadOptions) {
-            props.loadOptions(formContext).then(list => {
-                setOptions(list);
-            });
-        }
-    }
-
-    useEffect(() => {
-        reloadOptions();
-    }, []);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            required={props.required}
-            hidden={props.hidden}
-            help={props.help}
-            tooltip={props.tooltip}
-            getValueProps={(value) => {
-                if (value) {
-                    return {
-                        value: valueToForm(value)
-                    }
-                }
-                return value
-            }}
-        >
-            <$Select
-                {...props}
-                options={options}
-                formInstance={formContext}
-            />
-
-        </Form.Item>
-    )
-}
-
-export default FormSelect;
diff --git a/admin-pro-ui/src/components/form/selector.tsx b/admin-pro-ui/src/components/form/selector.tsx
deleted file mode 100644
index afb092da..00000000
--- a/admin-pro-ui/src/components/form/selector.tsx
+++ /dev/null
@@ -1,12 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import FormCheckbox from "@/components/form/checkbox";
-import "./form.scss";
-
-const FormSelector: React.FC<FormItemProps> = (props) => {
-    return (
-        <FormCheckbox {...props} />
-    )
-}
-
-export default FormSelector;
diff --git a/admin-pro-ui/src/components/form/slider.tsx b/admin-pro-ui/src/components/form/slider.tsx
deleted file mode 100644
index 3d747765..00000000
--- a/admin-pro-ui/src/components/form/slider.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Slider} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormSlider: React.FC<FormItemProps> = (props) => {
-
-    const {formContext} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            hidden={props.hidden}
-            help={props.help}
-            required={props.required}
-            tooltip={props.tooltip}
-        >
-            <Slider
-                disabled={props.disabled}
-                value={props.value}
-                max={props.sliderMaxNumber}
-                min={props.sliderMinNumber}
-                step={props.sliderStep}
-                range={props.sliderRange}
-                tooltip={props.sliderPopover && {
-                    open: true,
-                    placement: 'top',
-                    getPopupContainer: () => {
-                        return document.getElementById('root') as HTMLElement;
-                    }
-                } || {
-                    open: false
-                }}
-                marks={props.sliderMarks}
-                onChange={(value:any) => {
-                    formContext?.setFieldValue(props.name, value);
-                    props.onChange && props.onChange(value, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormSlider;
diff --git a/admin-pro-ui/src/components/form/stepper.tsx b/admin-pro-ui/src/components/form/stepper.tsx
deleted file mode 100644
index 42865f9c..00000000
--- a/admin-pro-ui/src/components/form/stepper.tsx
+++ /dev/null
@@ -1,42 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, InputNumber} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormStepper: React.FC<FormItemProps> = (props) => {
-
-    const {formContext} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            hidden={props.hidden}
-            help={props.help}
-            required={props.required}
-            tooltip={props.tooltip}
-        >
-            <InputNumber
-                style={{
-                    width:"100%"
-                }}
-                addonBefore={props.addonBefore}
-                addonAfter={props.addonAfter}
-                prefix={props.prefix}
-                suffix={props.suffix}
-                disabled={props.disabled}
-                value={props.value}
-                max={props.stepperMaxNumber}
-                min={props.stepperMinNumber}
-                step={props.stepperDecimalLength}
-                onChange={(value) => {
-                    formContext?.setFieldValue(props.name, value);
-                    props.onChange && props.onChange(value, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormStepper;
diff --git a/admin-pro-ui/src/components/form/switch.tsx b/admin-pro-ui/src/components/form/switch.tsx
deleted file mode 100644
index 15c0db9a..00000000
--- a/admin-pro-ui/src/components/form/switch.tsx
+++ /dev/null
@@ -1,44 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Switch as AntSwitch, SwitchProps as AntdSwitchProps} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-interface SwitchProps extends AntdSwitchProps {
-    value?: boolean;
-}
-
-const Switch: React.FC<SwitchProps> = ({value, ...props}) => {
-    return (
-        <AntSwitch checked={value} {...props}/>
-    )
-}
-
-const FormSwitch: React.FC<FormItemProps> = (props) => {
-
-    const {formContext} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            hidden={props.hidden}
-            required={props.required}
-            help={props.help}
-            tooltip={props.tooltip}
-        >
-            <Switch
-                disabled={props.disabled}
-                value={props.value}
-                checkedChildren={props.switchCheckText}
-                unCheckedChildren={props.switchUnCheckText}
-                onChange={(value) => {
-                    formContext?.setFieldValue(props.name, value);
-                    props.onChange && props.onChange(value, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormSwitch;
diff --git a/admin-pro-ui/src/components/form/textarea.tsx b/admin-pro-ui/src/components/form/textarea.tsx
deleted file mode 100644
index 7fc3c8ab..00000000
--- a/admin-pro-ui/src/components/form/textarea.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Input} from "antd";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormTextArea: React.FC<FormItemProps> = (props) => {
-
-    const {formContext} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            required={props.required}
-            hidden={props.hidden}
-            help={props.help}
-            tooltip={props.tooltip}
-        >
-            <Input.TextArea
-                disabled={props.disabled}
-                value={props.value}
-                showCount={true}
-                placeholder={props.placeholder}
-                maxLength={props.textAreaMaxLength}
-                rows={props.textAreaRows}
-                onChange={(value) => {
-                    const currentValue = value.target.value;
-                    formContext?.setFieldValue(props.name, currentValue);
-                    props.onChange && props.onChange(currentValue, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormTextArea;
diff --git a/admin-pro-ui/src/components/form/types.tsx b/admin-pro-ui/src/components/form/types.tsx
deleted file mode 100644
index 0fd138e3..00000000
--- a/admin-pro-ui/src/components/form/types.tsx
+++ /dev/null
@@ -1,190 +0,0 @@
-import {FormValidateContent} from "@/components/form/validate";
-import React from "react";
-import {NamePath} from "rc-field-form/es/interface";
-import {CodeEditorAction} from "@/components/CodeEditor";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-// Form表单选项类型
-export interface FormOption {
-    label: string;
-    value: string;
-    disable?: boolean;
-    children?: FormOption[];
-}
-
-// Form表单类型
-type FormFieldType =
-    "input" | "cascader" | "select" | "password" | "date" |
-    "radio" | "textarea" | "checkbox" | "uploader" | "switch" |
-    "stepper" | "slider" | "rate" | "selector" | "captcha" |
-    "code" | "color";
-
-// FormField
-export interface FormField {
-    // 表单字段类型
-    type: FormFieldType;
-    // 表单字段属性
-    props: FormItemProps;
-}
-
-// 自定义Select组件选项维护视图
-export interface SelectOptionFormEditProps {
-    // 当前表单操作对象
-    currentInstance?: FormInstance;
-    // 父级表单操作对象
-    formInstance?: FormInstance;
-}
-
-// Form表单字段属性
-export interface FormItemProps {
-    // 是否隐藏字段
-    hidden?: boolean;
-    // 是否禁用
-    disabled?: boolean;
-    // 是否必填,当为true时会自动给rules添加required校验
-    required?: boolean;
-    // 表单字段名
-    name?: NamePath;
-    // 表单字段标签
-    label?: React.ReactNode;
-    // 帮助提示信息,出现组件的底部
-    help?: string;
-    // 字段提示信息，出现在字段上
-    tooltip?: string;
-    // 组件内的前缀
-    prefix?: React.ReactNode;
-    // 组件内的后缀
-    suffix?: React.ReactNode;
-    // 组件前的前缀
-    addonBefore?:React.ReactNode;
-    // 组件后的后缀
-    addonAfter?:React.ReactNode;
-    // 表单值
-    value?: any;
-    // 输入提示
-    placeholder?: string;
-    // 变更事件
-    onChange?: (value: any, form?: FormInstance) => void;
-    // 静态选项，对应loadOptions的动态选项，仅限于select、radio等组件有效
-    options?: FormOption[],
-    // 动态加载选项,仅限于select、radio等组件有效
-    loadOptions?: (form?: FormInstance) => Promise<FormOption[]>,
-    // 动态校验函数,尽在fields模式下生效
-    validateFunction?: (content: FormValidateContent) => Promise<string[]>,
-
-    /** 以下为表单字段的拓展熟悉，非公共属性 **/
-    // 单选框方向
-    radioDirection?: "vertical" | "horizontal",
-    // 多选框方向
-    checkboxDirection?: "vertical" | "horizontal",
-
-    // TextArea输入行数
-    textAreaRows?: number,
-    // TextArea输入框最大值
-    textAreaMaxLength?: number,
-    // select组件是否支持多选
-    selectMultiple?: boolean,
-    // select组件添加的视图是否开启编辑
-    selectOptionFormEditable?: boolean,
-    // select组件添加的视图
-    selectOptionFormEditView?: React.ComponentType<SelectOptionFormEditProps>,
-    // select组件添加的视图title，默认添加选项
-    selectOptionFormEditTitle?: string,
-    // select组件添加的视图footer确定按钮文字，默认添加选项
-    selectOptionFormEditFooterOkText?: string,
-    // select组件添加的视图footer取消按钮文字，默认取消添加
-    selectOptionFormEditFooterCancelText?: string,
-    // Select组件添加数据事件
-    onSelectOptionFormFinish?: (formInstance: FormInstance,
-                                selectOptionFormEditFormInstance: FormInstance,
-                                reloadOption?: () => void,
-                                close?: () => void) => void;
-
-    // 文件上传接受的文件类型，默认为 image/*
-    uploaderAccept?: string,
-    // 文件上传最大数量
-    uploaderMaxCount?: number,
-    // input输入框最大值
-    inputMaxLength?: number,
-    // input输入框类型，默认为text
-    inputType?: "text" | "number",
-    // date组件的日期格式，默认YYYY-MM-DD
-    dateFormat?: string,
-    // date组件的精度，默认为day
-    datePrecision?: "year" | "month" | "day" | "hour" | "minute" | "second" | "week" | "week-day" | "quarter",
-    // switch选择文本
-    switchCheckText?: string,
-    // switch未选择文本
-    switchUnCheckText?: string,
-    // stepper组件的最大值
-    stepperMaxNumber?: number,
-    // stepper组件的最小值
-    stepperMinNumber?: number,
-    // stepper组件的小数位
-    stepperDecimalLength?: number,
-    // slider组件的最大值
-    sliderMaxNumber?: number,
-    // slider组件的最小值
-    sliderMinNumber?: number,
-    // slider组件的拖动步距
-    sliderStep?: number,
-    // slider组件实现展示刻度
-    sliderTicks?: boolean,
-    // slider组件悬浮提示
-    sliderPopover?: boolean,
-    // slider组件是否双向滑动
-    sliderRange?: boolean,
-    // slider组件的刻度尺
-    sliderMarks?: any,
-    // rate的star总数
-    rateCount?: number,
-    // rate允许半选
-    rateAllowHalf?: boolean,
-    // selector组件是否多选
-    selectorMultiple?: boolean,
-    // selector组件每行展示数量
-    selectorColumn?: number,
-    // code组件的语言，默认为javascript
-    codeLanguage?: string,
-    // code组件的主题，默认为vs-dark
-    codeTheme?: string,
-    // code组件的字体大小，默认为14
-    codeFontSize?: number,
-    // code组件的操作Action
-    codeActionRef?: React.RefObject<CodeEditorAction>,
-    // code组件的样式
-    codeStyle?: React.CSSProperties,
-    // code组件的选中运行事件
-    onCodeSelectedRun?: (value: string) => void,
-
-    // Captcha组件切换验证码事件
-    onCaptchaChange?: (value: string) => void;
-    // Captcha组件刷新验证码事件
-    onCaptchaRefresh?: () => Promise<{
-        // 验证码标志
-        code: string;
-        // 验证码图片地址
-        url: string;
-    }|null>;
-
-    // 文件上传事件
-    onUploaderUpload?: (filename: string, base64: string) => Promise<{
-        // 文件id
-        id: string,
-        // 文件名
-        name: string
-        // 文件地址
-        url: string;
-    }|null>
-    // 文件加载事件
-    onUploaderLoad?: (ids: string) => Promise<{
-        // 文件id
-        id: string,
-        // 文件名
-        name: string
-        // 文件地址
-        url: string;
-    }[]>
-
-
-}
diff --git a/admin-pro-ui/src/components/form/uploder.tsx b/admin-pro-ui/src/components/form/uploder.tsx
deleted file mode 100644
index bc926df0..00000000
--- a/admin-pro-ui/src/components/form/uploder.tsx
+++ /dev/null
@@ -1,171 +0,0 @@
-import React, {useEffect, useState} from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Button, Form, Image, Upload} from "antd";
-import formFieldInit from "@/components/form/common";
-import {PlusOutlined, UploadOutlined} from "@ant-design/icons";
-import {RcFile} from "antd/es/upload";
-import {UploadFile} from "antd/lib";
-import "./form.scss";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-const fileToBase64 = (file: RcFile): Promise<string> => {
-    return new Promise((resolve, reject) => {
-        const reader = new FileReader();
-        reader.readAsDataURL(file);
-        reader.onload = () => resolve(reader.result as string);
-        reader.onerror = error => reject(error);
-    });
-}
-
-const formToValue = (value: UploadFile[]) => {
-    if (value && value.length > 0) {
-        return value.map(item => {
-            if (item.response) {
-                return item.response.id;
-            }
-        }).join(',');
-    }
-    if(value && value.length==0){
-        return '';
-    }
-    return value;
-}
-
-interface UploaderProps extends FormItemProps {
-    formInstance?: FormInstance;
-    uploaderAccept: string
-}
-
-
-const Uploader: React.FC<UploaderProps> = (props) => {
-    const formInstance = props.formInstance;
-    const isImage = props.uploaderAccept === 'image/*';
-
-    const [fileList, setFileList] = React.useState<UploadFile[]>([]);
-    const [previewImage, setPreviewImage] = useState('');
-    const [previewOpen, setPreviewOpen] = useState(false);
-
-    const reloadFiles = () => {
-        if (props.value) {
-            if (props.onUploaderLoad) {
-                props.onUploaderLoad(props.value).then(res => {
-                    setFileList(res.map((item: any) => {
-                        return {
-                            uid: item.id || '-1',
-                            name: item.name,
-                            status: 'done',
-                            url: item.url,
-                            response: {
-                                id: item.id,
-                                url: item.url,
-                                name: item.name
-                            },
-                        }
-                    }))
-                });
-            }
-        }
-    }
-
-    useEffect(() => {
-        reloadFiles();
-    }, [props.value]);
-
-    const handlePreview = async (file: UploadFile) => {
-        setPreviewImage(file.response?.url);
-        setPreviewOpen(true);
-    };
-
-    return (
-        <div>
-            <Upload
-                disabled={props.disabled}
-                name={props.name}
-                fileList={fileList}
-                accept={props.uploaderAccept}
-                listType={isImage ? 'picture-card' : undefined}
-                maxCount={props.uploaderMaxCount}
-                customRequest={async ({file, onSuccess}) => {
-                    const currentFile = file as RcFile;
-                    const base64 = await fileToBase64(currentFile);
-                    const filename = currentFile.name;
-                    if (props.onUploaderUpload) {
-                        const res = await props.onUploaderUpload(filename, base64);
-                        if(res) {
-                            const {url, id, name} = res;
-                            // @ts-ignore
-                            onSuccess({
-                                url: url,
-                                id: id,
-                                name: name
-                            });
-                        }
-                    } else {
-                        const url = URL.createObjectURL(currentFile);
-                        // @ts-ignore
-                        onSuccess({
-                            url: url,
-                            id: Math.random(),
-                            name: currentFile.name
-                        });
-                    }
-                }}
-                onChange={(info) => {
-                    const fileList = info.fileList;
-                    if(fileList.length>0 && fileList.every(item=>item.status==='done')) {
-                        const currentValue = formToValue(fileList);
-                        formInstance?.setFieldValue(props.name, currentValue);
-                        props.onChange && props.onChange(currentValue, formInstance);
-                    }
-                    setFileList(fileList);
-                }}
-                onPreview={isImage ? handlePreview : undefined}
-            >
-                {isImage && (
-                    <PlusOutlined/>
-                )}
-                {!isImage && (
-                    <Button icon={<UploadOutlined/>}>选择文件</Button>
-                )}
-
-            </Upload>
-
-            {isImage && previewImage && (
-                <Image
-                    wrapperStyle={{display: 'none'}}
-                    preview={{
-                        visible: previewOpen,
-                        onVisibleChange: (visible) => setPreviewOpen(visible),
-                        afterOpenChange: (visible) => !visible && setPreviewImage(''),
-                    }}
-                    src={previewImage}
-                />
-            )}
-        </div>
-    )
-}
-
-const FormUploader: React.FC<FormItemProps> = (props) => {
-    const {formContext} = formFieldInit(props);
-    const accept = props.uploaderAccept || "image/*";
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            required={props.required}
-            hidden={props.hidden}
-            help={props.help}
-            tooltip={props.tooltip}
-        >
-            <Uploader
-                formInstance={formContext}
-                value={props.value}
-                onChange={props.onChange}
-                uploaderAccept={accept}
-                {...props}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormUploader;
diff --git a/admin-pro-ui/src/components/form/utils.ts b/admin-pro-ui/src/components/form/utils.ts
deleted file mode 100644
index 1e0be44f..00000000
--- a/admin-pro-ui/src/components/form/utils.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-import {FormValidateContent} from "@/components/form/validate";
-
-class ValidateUtils {
-
-    /**
-     * 非空校验
-     * @param content 校验对象
-     * @param message 错误信息
-     */
-    static validateNotEmpty = async (content: FormValidateContent, message?: string) => {
-        const field = content.getFieldProps();
-        const errorMessage = message ? message : field?.props.label + '不能为空' || '不能为空';
-        const value = content.value;
-        if (value) {
-            if (Array.isArray(value)) {
-                if (value.length === 0) {
-                    return [errorMessage];
-                }else {
-                    return [];
-                }
-            } else {
-                return [];
-            }
-        } else {
-            return [errorMessage];
-        }
-    }
-}
-
-export default ValidateUtils;
diff --git a/admin-pro-ui/src/components/form/validate.ts b/admin-pro-ui/src/components/form/validate.ts
deleted file mode 100644
index 4f43818b..00000000
--- a/admin-pro-ui/src/components/form/validate.ts
+++ /dev/null
@@ -1,92 +0,0 @@
-import {NamePath} from "rc-field-form/es/interface";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-// 流程表单验证内容
-export class FormValidateContent {
-
-    readonly value: any;
-    readonly name: NamePath;
-    readonly form: FormInstance;
-
-    constructor(value: any, name: NamePath, form: FormInstance) {
-        this.value = value;
-        this.name = name;
-        this.form = form;
-    }
-
-    getFieldProps = () => {
-        return this.form.getFieldProps(this.name);
-    }
-}
-
-// 自定义验证上下文
-export class FormValidateContext {
-
-    private readonly map: Map<NamePath, (content: FormValidateContent) => Promise<string[]>>;
-
-    constructor() {
-        this.map = new Map<NamePath, (content: FormValidateContent) => Promise<string[]>>();
-    }
-
-    public addValidateFunction(name: NamePath, validateFunction: (content: FormValidateContent) => Promise<string[]>) {
-        this.map.set(name, validateFunction);
-    }
-
-    public clear() {
-        this.map.clear();
-    }
-
-    public getValidate(name: NamePath) {
-        return this.map.get(name);
-    }
-
-
-    public validateField = (name: NamePath, form: FormInstance) => {
-        return new Promise((resolve, reject) => {
-            const value = form.getFieldValue(name);
-            const content = new FormValidateContent(value, name, form);
-            const validateFunction = this.getValidate(name);
-            if (validateFunction) {
-                validateFunction(content)
-                    .then((res) => {
-                        form.setFields(
-                            [
-                                {
-                                    name: name,
-                                    errors: res,
-                                }
-                            ]
-                        )
-                        if (res.length > 0) {
-                            resolve(false);
-                        } else {
-                            resolve(true);
-                        }
-                    })
-                    .catch((error) => {
-                        form.setFields(
-                            [
-                                {
-                                    name: name,
-                                    errors: [error],
-                                }
-                            ]
-                        )
-                        console.log('error', error)
-                        reject(false);
-                    })
-            }
-        });
-    }
-
-    public validate = async (form: FormInstance) => {
-        const list = Array.from(this.map.keys().map(item => {
-            return this.validateField(item, form);
-        }));
-
-        const results = await Promise.all(list);
-        return results.every((result) => result);
-    }
-}
-
-
diff --git a/admin-pro-ui/src/framework/ComponentBus/index.tsx b/admin-pro-ui/src/framework/ComponentBus/index.tsx
deleted file mode 100644
index 22528f84..00000000
--- a/admin-pro-ui/src/framework/ComponentBus/index.tsx
+++ /dev/null
@@ -1,78 +0,0 @@
-import React from "react";
-import {loadRemoteComponent, loadRemoteScript} from "@/utils/dynamicLoader";
-
-class ComponentBus {
-
-    private readonly componentBus = new Map<string, React.ComponentType<any>>();
-
-    /**
-     * 注册组件
-     * @param key 组件key
-     * @param component 组件类型
-     */
-    public registerComponent = (key: string, component: React.ComponentType<any>) => {
-        this.componentBus.set(key, component);
-    }
-
-    /**
-     * 删除组件
-     * @param key  组件key
-     */
-    public removeComponent = (key: string) => {
-        this.componentBus.delete(key);
-    }
-
-    /**
-     * 注册远程组件
-     * @param key 组件key
-     * @param remoteUrl 远程组件地址
-     * @param scope     远程组件作用域
-     * @param module    远程组件名称
-     */
-    public registerRemoteComponent = (key: string, remoteUrl: string, scope: string, module: string): Promise<boolean> => {
-        return new Promise((resolve, reject) => {
-            loadRemoteScript(remoteUrl).then(() => {
-                loadRemoteComponent(scope, module)
-                    .then((ComponentModule: any) => {
-                        const Component = ComponentModule.default || ComponentModule;
-                        this.registerComponent(key, Component);
-                        resolve(true);
-                    }).catch(error => {
-                    reject(error);
-                });
-            }).catch(error => {
-                reject(error);
-            });
-        })
-    }
-
-    /**
-     * 获取组件
-     * @param key 组件key
-     * @param defaultComponent 默认组件
-     */
-    public getComponent = <T extends {} = any>(key: string, defaultComponent?: React.ComponentType<T>): React.ComponentType<T> | undefined => {
-        const component = this.componentBus.get(key) as React.ComponentType<T> | undefined;
-        if (component) {
-            return component;
-        }
-        if (defaultComponent) {
-            return defaultComponent;
-        }
-        return undefined;
-    };
-
-    private ComponentBus() {
-        // 私有构造函数，防止外部实例化
-    }
-
-    private static instance: ComponentBus = new ComponentBus();
-
-    // 单例模式
-    public static getInstance(): ComponentBus {
-        return ComponentBus.instance;
-    }
-}
-
-export default ComponentBus;
-
diff --git a/admin-pro-ui/src/framework/EventBus/index.ts b/admin-pro-ui/src/framework/EventBus/index.ts
deleted file mode 100644
index d81efb0a..00000000
--- a/admin-pro-ui/src/framework/EventBus/index.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-class GlobalEvent {
-    private static instance: GlobalEvent;
-    private events: Map<string, Function[]>;
-
-    private constructor() {
-        this.events = new Map();
-    }
-
-    public static getInstance(): GlobalEvent {
-        if (!this.instance) {
-            this.instance = new GlobalEvent();
-        }
-        return this.instance;
-    }
-
-    public on(eventName: string, callback: Function): void {
-        const callbacks = this.events.get(eventName) || [];
-        callbacks.push(callback);
-        this.events.set(eventName, callbacks);
-    }
-
-    public emit(eventName: string, ...args: any[]): void {
-        const callbacks = this.events.get(eventName);
-        if (callbacks) {
-            callbacks.forEach((callback) => {
-                try {
-                    callback(...args);
-                } catch (err) {
-                    console.error(
-                        `Error executing callback for event: ${eventName}`,
-                        err
-                    );
-                }
-            });
-        }
-    }
-
-    public off(eventName: string, callback?: Function): void {
-        if (callback) {
-            const callbacks = this.events.get(eventName);
-            if (callbacks) {
-                const callbackIndex = callbacks.indexOf(callback);
-                if (callbackIndex > -1) {
-                    callbacks.splice(callbackIndex, 1);
-                    if (callbacks.length === 0) {
-                        this.events.delete(eventName);
-                    } else {
-                        this.events.set(eventName, callbacks);
-                    }
-                }
-            }
-        } else {
-            this.events.delete(eventName);
-        }
-    }
-}
-
-export const events = GlobalEvent.getInstance();
diff --git a/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx b/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
index ad317b31..26926214 100644
--- a/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
+++ b/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
@@ -1,9 +1,7 @@
 import React, {useEffect} from "react";
 import {FlowFormViewProps} from "@/components/flow/types";
-import Form from "@/components/form";
-import FormInput from "@/components/form/input";
-import ValidateUtils from "@/components/form/utils";
-import FormTextArea from "@/components/form/textarea";
+import {Form,FormInput,FormTextArea} from "@codingapi/form-pc";
+import {ValidateUtils} from "@codingapi/ui-framework";
 
 const LeaveForm: React.FC<FlowFormViewProps> = (props) => {
 
diff --git a/admin-pro-ui/src/pages/flow/user/index.tsx b/admin-pro-ui/src/pages/flow/user/index.tsx
index 885c102d..d52717ec 100644
--- a/admin-pro-ui/src/pages/flow/user/index.tsx
+++ b/admin-pro-ui/src/pages/flow/user/index.tsx
@@ -4,10 +4,8 @@ import {changeManager, entrust, list, remove, removeEntrust, save} from "@/api/u
 import {Button, message, Modal, Popconfirm, Space} from "antd";
 import {DeleteOutlined, SettingOutlined} from "@ant-design/icons";
 import UserSelect from "@/pages/flow/user/select";
-import Form from "@/components/form";
-import FormInput from "@/components/form/input";
-import ValidateUtils from "@/components/form/utils";
-import FormSwitch from "@/components/form/switch";
+import {Form,FormInput,FormSwitch} from "@codingapi/form-pc";
+import {ValidateUtils} from "@codingapi/ui-framework";
 
 const UserPage = () => {
 
diff --git a/admin-pro-ui/src/pages/flow/work/index.tsx b/admin-pro-ui/src/pages/flow/work/index.tsx
index e0915f37..f241d93f 100644
--- a/admin-pro-ui/src/pages/flow/work/index.tsx
+++ b/admin-pro-ui/src/pages/flow/work/index.tsx
@@ -3,11 +3,8 @@ import Flow, {FlowActionType} from "@/components/flow";
 import {ActionType, PageContainer, ProTable} from "@ant-design/pro-components";
 import {changeState, copy, list, remove, save, schema} from "@/api/flow";
 import {Button, Drawer, message, Modal, Popconfirm, Space} from "antd";
-import Form from "@/components/form";
-import FormInput from "@/components/form/input";
-import ValidateUtils from "@/components/form/utils";
-import FormTextArea from "@/components/form/textarea";
-import FormSwitch from "@/components/form/switch";
+import {Form,FormInput,FormTextArea,FormSwitch} from "@codingapi/form-pc";
+import {ValidateUtils} from "@codingapi/ui-framework";
 
 const FlowPage = () => {
 
diff --git a/admin-pro-ui/src/pages/form/index.tsx b/admin-pro-ui/src/pages/form/index.tsx
index 7211a8f5..34650e78 100644
--- a/admin-pro-ui/src/pages/form/index.tsx
+++ b/admin-pro-ui/src/pages/form/index.tsx
@@ -1,25 +1,26 @@
 import React from 'react';
 import {PageContainer} from "@ant-design/pro-components";
-import Form from "@/components/form";
-import FormInput from "@/components/form/input";
 import {Button, Col, message, Row} from "antd";
-import {FormField} from "@/components/form/types";
-import FormPassword from "@/components/form/password";
-import FormCaptcha from "@/components/form/captcha";
-import FormCheckbox from "@/components/form/checkbox";
-import FormRadio from "@/components/form/radio";
-import FormRate from "@/components/form/rate";
-import FormSlider from "@/components/form/slider";
-import FormStepper from "@/components/form/stepper";
-import FormSwitch from "@/components/form/switch";
-import FormTextArea from "@/components/form/textarea";
-import FormDate from "@/components/form/date";
-import FormCascader from "@/components/form/cascader";
-import FormSelect from "@/components/form/select";
-import FormUploader from "@/components/form/uploder";
-import FormColor from "@/components/form/color";
-import FormCode from "@/components/form/code";
-import FormInstance from "@/components/form/domain/FormInstance";
+import {
+    FormCascader,
+    FormCode,
+    FormColor,
+    FormDate,
+    FormRadio,
+    FormRate,
+    FormSelect,
+    FormSlider,
+    FormStepper,
+    FormSwitch,
+    FormTextArea,
+    FormUploader,
+    FormCheckbox,
+    FormCaptcha,
+    FormPassword,
+    FormInput,
+    Form
+} from "@codingapi/form-pc";
+import {FormInstance,FormField} from "@codingapi/ui-framework";
 
 
 const FooterButtons: React.FC<{ formInstance: FormInstance }> = ({formInstance}) => {
@@ -40,7 +41,7 @@ const FooterButtons: React.FC<{ formInstance: FormInstance }> = ({formInstance})
             select: '1,2',
             avatar: 'c84fb304c180f61bb7db40efef7f85b7',
             color: '#000000',
-            ideCode:'console.log("hello world")'
+            ideCode: 'console.log("hello world")'
         }
     }
 
@@ -132,7 +133,7 @@ const FooterButtons: React.FC<{ formInstance: FormInstance }> = ({formInstance})
             <Button
                 onClick={async () => {
                     formInstance.create({
-                        props:{
+                        props: {
                             required: true,
                             name: ['user', 'name'],
                             label: '姓名',
@@ -145,8 +146,8 @@ const FooterButtons: React.FC<{ formInstance: FormInstance }> = ({formInstance})
                                 return ['姓名不能为空']
                             }
                         },
-                        type:'input'
-                    },0);
+                        type: 'input'
+                    }, 0);
                 }}
             >添加姓名字段</Button>
 
diff --git a/admin-pro-ui/src/pages/mirco/index.tsx b/admin-pro-ui/src/pages/mirco/index.tsx
index 9b304ac9..7881ae64 100644
--- a/admin-pro-ui/src/pages/mirco/index.tsx
+++ b/admin-pro-ui/src/pages/mirco/index.tsx
@@ -1,6 +1,6 @@
 import React, {useState} from "react";
 import {Button, message, Space} from "antd";
-import ComponentBus from "@/framework/ComponentBus";
+import {Access, ComponentBus} from "@codingapi/ui-framework";
 import {HeaderProps} from "@/gateway";
 import HeaderDefault from "@/gateway/default/Header";
 import {ModalForm, ProForm, ProFormText} from "@ant-design/pro-components";
@@ -51,10 +51,12 @@ const MircoPage = () => {
                         setVisible(true);
                     }}>load remote component</Button>
 
-                    <Button onClick={() => {
-                        ComponentBus.getInstance().removeComponent(HeaderKey);
-                        refreshPage();
-                    }}>remove remote component</Button>
+                    <Access hasRoles={['admin']}>
+                        <Button onClick={() => {
+                            ComponentBus.getInstance().removeComponent(HeaderKey);
+                            refreshPage();
+                        }}>remove remote component</Button>
+                    </Access>
                 </Space>
             </div>
 

From afa239de322fb7f35a15f18cd54e4e26c55fc131 Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Sun, 27 Apr 2025 22:11:55 +0800
Subject: [PATCH 14/20] remove flow

---
 admin-pro-ui/package.json                     |   3 +-
 .../{components => }/PostponedFormView.tsx    |   2 +-
 .../flow/{components => }/UserSelectView.tsx  |   3 +-
 .../components/flow/components/FlowButton.tsx |  75 ---
 .../components/flow/components/FlowChart.tsx  |  95 ----
 .../flow/components/FlowContent.tsx           |  97 ----
 .../flow/components/FlowForm404.tsx           |  26 -
 .../flow/components/FlowFormOpinion.tsx       |  46 --
 .../components/flow/components/FlowHeader.tsx |  27 -
 .../flow/components/FlowHistory.tsx           | 167 ------
 .../flow/components/FlowHistoryLine.tsx       |  55 --
 .../flow/components/FlowOpinion.tsx           |  54 --
 .../components/flow/components/FlowPage.tsx   | 134 -----
 .../components/flow/components/FlowResult.tsx |  49 --
 .../flow/domain/FlowButtonClickContext.ts     | 316 -----------
 .../src/components/flow/domain/FlowContext.ts |  25 -
 .../flow/domain/FlowEventContext.ts           | 348 ------------
 .../flow/domain/FlowPanelContext.ts           | 528 ------------------
 .../flow/domain/FlowRecordContext.ts          | 211 -------
 .../flow/domain/FlowResultParser.ts           |  92 ---
 .../flow/domain/FlowStateContext.tsx          |  95 ----
 .../flow/domain/FlowTriggerContext.ts         |  32 --
 admin-pro-ui/src/components/flow/index.scss   | 115 ----
 admin-pro-ui/src/components/flow/index.tsx    | 125 -----
 .../components/flow/nodes/Circulate/index.tsx | 140 -----
 .../src/components/flow/nodes/Node/index.tsx  | 129 -----
 .../src/components/flow/nodes/Over/index.tsx  | 142 -----
 .../src/components/flow/nodes/Start/index.tsx | 126 -----
 .../flow/nodes/panel/ButtonPanel.tsx          | 230 --------
 .../components/flow/nodes/panel/EdgePanel.tsx | 195 -------
 .../components/flow/nodes/panel/NodePanel.tsx | 279 ---------
 .../flow/nodes/panel/ScriptModal.scss         |  33 --
 .../flow/nodes/panel/ScriptModal.tsx          |  71 ---
 .../components/flow/nodes/panel/StateTag.tsx  |  46 --
 .../components/flow/nodes/panel/circulate.tsx |  71 ---
 .../src/components/flow/nodes/panel/help.ts   |  95 ----
 .../src/components/flow/nodes/panel/node.tsx  |  81 ---
 .../src/components/flow/nodes/panel/over.tsx  |  51 --
 .../src/components/flow/nodes/panel/start.tsx |  81 ---
 .../components/flow/panel/ControlPanel.scss   |  35 --
 .../components/flow/panel/ControlPanel.tsx    |  95 ----
 .../src/components/flow/panel/NodePanel.scss  |  29 -
 .../src/components/flow/panel/NodePanel.tsx   | 103 ----
 .../flow/register/flow.register.tsx           |  10 -
 .../src/components/flow/store/FlowSlice.ts    | 124 ----
 admin-pro-ui/src/components/flow/types.ts     | 179 ------
 .../src/components/flow/utils/script.ts       |  61 --
 .../components/flow/view/FlowModelView.scss   |  26 -
 .../components/flow/view/FlowModelView.tsx    |  32 --
 .../src/components/flow/view/index.scss       |  65 ---
 .../src/components/flow/view/index.tsx        | 109 ----
 admin-pro-ui/src/pages/flow/record/index.tsx  |   2 +-
 admin-pro-ui/src/pages/flow/work/index.tsx    |   2 +-
 53 files changed, 6 insertions(+), 5356 deletions(-)
 rename admin-pro-ui/src/components/flow/{components => }/PostponedFormView.tsx (94%)
 rename admin-pro-ui/src/components/flow/{components => }/UserSelectView.tsx (97%)
 delete mode 100644 admin-pro-ui/src/components/flow/components/FlowButton.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/components/FlowChart.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/components/FlowContent.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/components/FlowForm404.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/components/FlowHeader.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/components/FlowHistory.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/components/FlowHistoryLine.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/components/FlowOpinion.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/components/FlowPage.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/components/FlowResult.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/domain/FlowButtonClickContext.ts
 delete mode 100644 admin-pro-ui/src/components/flow/domain/FlowContext.ts
 delete mode 100644 admin-pro-ui/src/components/flow/domain/FlowEventContext.ts
 delete mode 100644 admin-pro-ui/src/components/flow/domain/FlowPanelContext.ts
 delete mode 100644 admin-pro-ui/src/components/flow/domain/FlowRecordContext.ts
 delete mode 100644 admin-pro-ui/src/components/flow/domain/FlowResultParser.ts
 delete mode 100644 admin-pro-ui/src/components/flow/domain/FlowStateContext.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/domain/FlowTriggerContext.ts
 delete mode 100644 admin-pro-ui/src/components/flow/index.scss
 delete mode 100644 admin-pro-ui/src/components/flow/index.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/Circulate/index.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/Node/index.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/Over/index.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/Start/index.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.scss
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/panel/StateTag.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/panel/circulate.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/panel/help.ts
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/panel/node.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/panel/over.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/nodes/panel/start.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/panel/ControlPanel.scss
 delete mode 100644 admin-pro-ui/src/components/flow/panel/ControlPanel.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/panel/NodePanel.scss
 delete mode 100644 admin-pro-ui/src/components/flow/panel/NodePanel.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/register/flow.register.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/store/FlowSlice.ts
 delete mode 100644 admin-pro-ui/src/components/flow/types.ts
 delete mode 100644 admin-pro-ui/src/components/flow/utils/script.ts
 delete mode 100644 admin-pro-ui/src/components/flow/view/FlowModelView.scss
 delete mode 100644 admin-pro-ui/src/components/flow/view/FlowModelView.tsx
 delete mode 100644 admin-pro-ui/src/components/flow/view/index.scss
 delete mode 100644 admin-pro-ui/src/components/flow/view/index.tsx

diff --git a/admin-pro-ui/package.json b/admin-pro-ui/package.json
index b181b121..47ce3e7b 100644
--- a/admin-pro-ui/package.json
+++ b/admin-pro-ui/package.json
@@ -7,7 +7,8 @@
     "@ant-design/icons": "^5.4.0",
     "@ant-design/pro-components": "^2.8.2",
     "@babel/standalone": "^7.25.6",
-    "@codingapi/form-pc": "^0.0.15",
+    "@codingapi/flow-pc": "^0.0.3",
+    "@codingapi/form-pc": "^0.0.16",
     "@codingapi/ui-framework": "^0.0.12",
     "@dnd-kit/core": "^6.2.0",
     "@dnd-kit/sortable": "^9.0.0",
diff --git a/admin-pro-ui/src/components/flow/components/PostponedFormView.tsx b/admin-pro-ui/src/components/flow/PostponedFormView.tsx
similarity index 94%
rename from admin-pro-ui/src/components/flow/components/PostponedFormView.tsx
rename to admin-pro-ui/src/components/flow/PostponedFormView.tsx
index 5f098415..2b571a5c 100644
--- a/admin-pro-ui/src/components/flow/components/PostponedFormView.tsx
+++ b/admin-pro-ui/src/components/flow/PostponedFormView.tsx
@@ -1,6 +1,6 @@
 import React from "react";
 import {ModalForm, ProFormDigit} from "@ant-design/pro-components";
-import {PostponedFormProps} from "@/components/flow/types";
+import {PostponedFormProps} from "@codingapi/ui-framework";
 
 
 const PostponedFormView:React.FC<PostponedFormProps> = (props)=>{
diff --git a/admin-pro-ui/src/components/flow/components/UserSelectView.tsx b/admin-pro-ui/src/components/flow/UserSelectView.tsx
similarity index 97%
rename from admin-pro-ui/src/components/flow/components/UserSelectView.tsx
rename to admin-pro-ui/src/components/flow/UserSelectView.tsx
index 0bfc3fb5..af129a9c 100644
--- a/admin-pro-ui/src/components/flow/components/UserSelectView.tsx
+++ b/admin-pro-ui/src/components/flow/UserSelectView.tsx
@@ -1,9 +1,8 @@
 import React, {useEffect} from "react";
-import {UserSelectFormProps} from "@/components/flow/types";
+import {UserSelectFormProps} from "@codingapi/ui-framework";
 import {ModalForm, ProForm, ProFormSelect} from "@ant-design/pro-components";
 import {users} from "@/api/user";
 
-
 const UserSelectView: React.FC<UserSelectFormProps> = (props) => {
 
     const [form] = ProForm.useForm();
diff --git a/admin-pro-ui/src/components/flow/components/FlowButton.tsx b/admin-pro-ui/src/components/flow/components/FlowButton.tsx
deleted file mode 100644
index 511e6081..00000000
--- a/admin-pro-ui/src/components/flow/components/FlowButton.tsx
+++ /dev/null
@@ -1,75 +0,0 @@
-import React, {useContext} from "react";
-import {FlowViewReactContext} from "@/components/flow/view";
-import {useSelector} from "react-redux";
-import {FlowReduxState} from "@/components/flow/store/FlowSlice";
-import {Button} from "antd";
-
-interface FlowHeaderProps{
-    setVisible:(visible:boolean)=>void;
-}
-
-const FlowButton:React.FC<FlowHeaderProps> = (props) => {
-    const flowViewReactContext = useContext(FlowViewReactContext);
-
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-
-    const flowButtonClickContext = flowViewReactContext?.flowButtonClickContext;
-
-    const buttons = flowRecordContext?.getFlowButtons()||[];
-    const requestLoading = useSelector((state: FlowReduxState) => state.flow.requestLoading);
-    const contentHiddenVisible = useSelector((state: FlowReduxState) => state.flow.contentHiddenVisible);
-
-    const style = contentHiddenVisible ? {"display":"none"} : {};
-
-    if(flowRecordContext?.isEditable()){
-        return (
-            <div className={"flow-buttons-content"} style={style}>
-                {buttons.map((item) => {
-                    const style = item.style && JSON.parse(item.style) || {};
-                    return (
-                        <Button
-                            loading={requestLoading}
-                            key={item.id}
-                            className={"flow-buttons-item"}
-                            style={{
-                                ...style
-                            }}
-                            onClick={() => {
-                                flowButtonClickContext?.handlerClick(item);
-                            }}
-                        >{item.name}</Button>
-                    )
-                })}
-
-                <Button
-                    color={"default"}
-                    className={"flow-buttons-item"}
-                    onClick={() => {
-                        props.setVisible(false);
-                    }}
-                >
-                    关闭
-                </Button>
-
-            </div>
-        )
-    }else {
-        return (
-            <div className={"flow-buttons-content"} style={style}>
-                <Button
-                    loading={requestLoading}
-                    style={{
-                        marginLeft:'15%',
-                        marginRight:'15%'
-                    }}
-                    className={"flow-buttons-item"}
-                    onClick={() => {
-                        props.setVisible(false);
-                    }}
-                >关闭</Button>
-            </div>
-        )
-    }
-}
-
-export default FlowButton;
diff --git a/admin-pro-ui/src/components/flow/components/FlowChart.tsx b/admin-pro-ui/src/components/flow/components/FlowChart.tsx
deleted file mode 100644
index 325d53f4..00000000
--- a/admin-pro-ui/src/components/flow/components/FlowChart.tsx
+++ /dev/null
@@ -1,95 +0,0 @@
-import React, {useContext, useEffect} from "react";
-import '@logicflow/core/es/index.css';
-import '@logicflow/extension/lib/style/index.css';
-import {LogicFlow, Options} from "@logicflow/core";
-import {DndPanel, Menu, MiniMap, Snapshot} from "@logicflow/extension";
-import {FlowViewReactContext} from "@/components/flow/view";
-import Start from "@/components/flow/nodes/Start";
-import Over from "@/components/flow/nodes/Over";
-import Circulate from "@/components/flow/nodes/Circulate";
-import Node from "@/components/flow/nodes/Node";
-import "@/components/flow/index.scss";
-
-import EdgeType = Options.EdgeType;
-
-interface FlowChartProps {
-    edgeType?: EdgeType;
-}
-
-const FlowChart: React.FC<FlowChartProps> = (props) => {
-
-    const flowViewReactContext = useContext(FlowViewReactContext);
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-    const flowSchema = flowRecordContext?.getFlowSchema();
-
-    const [url, setUrl] = React.useState<string>('');
-
-    const edgeType = props.edgeType || 'polyline';
-    const container = React.useRef<HTMLDivElement>(null);
-    const lfRef = React.useRef<LogicFlow>(null);
-
-    useEffect(() => {
-        const SilentConfig = {
-            isSilentMode: true,
-            stopScrollGraph: false,
-            stopMoveGraph: false,
-            stopZoomGraph: false,
-            edgeTextEdit: false,
-        };
-
-        //@ts-ignore
-        lfRef.current = new LogicFlow({
-            //@ts-ignore
-            container: container.current,
-            ...SilentConfig,
-            background: {
-                backgroundColor: '#f3f5f8'
-            },
-            width: 0,
-            height: 0,
-            plugins: [Menu, DndPanel, MiniMap, Snapshot],
-            grid: false,
-            edgeType: edgeType,
-        });
-
-        lfRef.current.setTheme({
-            bezier: {
-                stroke: '#8f94e3',
-                strokeWidth: 1,
-            },
-            polyline: {
-                stroke: '#8f94e3',
-                strokeWidth: 1,
-            },
-            line: {
-                stroke: '#8f94e3',
-                strokeWidth: 1,
-            },
-        });
-        lfRef.current.register(Start);
-        lfRef.current.register(Node);
-        lfRef.current.register(Over);
-        lfRef.current.register(Circulate);
-        lfRef.current.render(flowSchema);
-
-        setTimeout(() => {
-            lfRef.current?.getSnapshotBlob().then((blob: any) => {
-                setUrl(URL.createObjectURL(blob.data));
-            });
-        }, 100)
-
-    }, [flowViewReactContext]);
-
-    return (
-        <div>
-            <div className="flow-chart">
-                <div className={"flow-chart-content"} ref={container}/>
-                {url && (
-                    <img src={url} className={"flow-img"}/>
-                )}
-            </div>
-        </div>
-    )
-}
-
-export default FlowChart;
diff --git a/admin-pro-ui/src/components/flow/components/FlowContent.tsx b/admin-pro-ui/src/components/flow/components/FlowContent.tsx
deleted file mode 100644
index f7a857d8..00000000
--- a/admin-pro-ui/src/components/flow/components/FlowContent.tsx
+++ /dev/null
@@ -1,97 +0,0 @@
-import React, {useContext, useEffect} from "react";
-import {FlowFormViewProps} from "@/components/flow/types";
-import {FlowViewReactContext} from "@/components/flow/view";
-import {useSelector} from "react-redux";
-import {FlowReduxState} from "@/components/flow/store/FlowSlice";
-import {Divider, Tabs, TabsProps} from "antd";
-import FlowFormOpinion from "@/components/flow/components/FlowFormOpinion";
-import FlowHistory from "@/components/flow/components/FlowHistory";
-import FlowOpinion from "@/components/flow/components/FlowOpinion";
-import FlowChart from "@/components/flow/components/FlowChart";
-import FlowHistoryLine from "@/components/flow/components/FlowHistoryLine";
-
-const FlowContent = () => {
-    const flowViewReactContext = useContext(FlowViewReactContext);
-
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-    const formInstance = flowViewReactContext?.formInstance;
-
-    const FlowFormView = flowRecordContext?.getFlowFormView() as React.ComponentType<FlowFormViewProps>;
-
-    const formParams = flowRecordContext?.getFlowFormParams();
-
-    const opinionVisible = useSelector((state: FlowReduxState) => state.flow.opinionVisible);
-    const dataVersion = useSelector((state: FlowReduxState) => state.flow.dataVersion);
-    const contentHiddenVisible = useSelector((state: FlowReduxState) => state.flow.contentHiddenVisible);
-    const [currentTab, setCurrentTab] = React.useState('detail');
-
-    useEffect(() => {
-        if (!flowRecordContext?.isEditable()) {
-            setTimeout(() => {
-                formInstance?.disableAll();
-            }, 100);
-        }
-    }, []);
-
-    const style = contentHiddenVisible ? {"display": "none"} : {};
-
-    const items = [
-        {
-            label: '流程详情',
-            key: 'detail'
-        },
-        {
-            label: '流程记录',
-            key: 'record'
-        },
-        {
-            label: '流程图',
-            key: 'chart'
-        }
-    ] as TabsProps['items'];
-
-    return (
-        <div className={"flow-view-content"} style={style}>
-            <Tabs
-                items={items}
-                activeKey={currentTab}
-                onChange={(value) => {
-                    setCurrentTab(value)
-                }}/>
-
-            {currentTab ==='detail' && (
-                <>
-                    {formInstance && (
-                        <FlowFormView
-                            data={formParams}
-                            form={formInstance}
-                            dataVersion={dataVersion}
-                        />
-                    )}
-
-                    {opinionVisible && (
-                        <FlowFormOpinion/>
-                    )}
-                </>
-            )}
-
-            {currentTab ==='record' && (
-                <>
-                    <FlowHistory/>
-                    <Divider>审批记录</Divider>
-                    <FlowOpinion/>
-                </>
-            )}
-
-            {currentTab ==='chart' && (
-                <>
-                    <FlowChart/>
-                    <Divider>流转历史</Divider>
-                    <FlowHistoryLine/>
-                </>
-            )}
-        </div>
-    )
-}
-
-export default FlowContent;
diff --git a/admin-pro-ui/src/components/flow/components/FlowForm404.tsx b/admin-pro-ui/src/components/flow/components/FlowForm404.tsx
deleted file mode 100644
index 1e95b397..00000000
--- a/admin-pro-ui/src/components/flow/components/FlowForm404.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-import React from "react";
-import {Button, Result} from "antd";
-
-interface FlowForm404Props{
-    setVisible:(visible:boolean)=>void;
-}
-
-const FlowForm404:React.FC<FlowForm404Props> = (props)=>{
-
-    return (
-        <Result
-            status='error'
-            title={"抱歉，没有配置流程视图"}
-        >
-            <Button
-                className={"flow-result-content-button"}
-                block={true}
-                onClick={()=>{
-                    props.setVisible(false);
-                }}
-            >关闭页面</Button>
-        </Result>
-    )
-}
-
-export default FlowForm404;
diff --git a/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx b/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx
deleted file mode 100644
index b9fcbba0..00000000
--- a/admin-pro-ui/src/components/flow/components/FlowFormOpinion.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import React, {useContext, useEffect} from "react";
-import {Form} from "@codingapi/form-pc";
-import {FlowViewReactContext} from "@/components/flow/view";
-
-const FlowFormOpinion = ()=>{
-
-    const flowViewReactContext = useContext(FlowViewReactContext);
-    const opinionInstance = flowViewReactContext?.opinionInstance;
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-
-    useEffect(() => {
-        opinionInstance?.setFieldValue("advice", flowRecordContext?.getOpinionAdvice());
-    }, []);
-
-    return (
-        <>
-            <Form
-                form={opinionInstance}
-                layout={"vertical"}
-                loadFields={async ()=>{
-                    return [
-                        {
-                            type:'textarea',
-                            props:{
-                                name:"advice",
-                                label:"审批意见",
-                                textAreaRows:2,
-                                required:true,
-                                validateFunction:async (content)=>{
-                                    const value = content.value;
-                                    if(value){
-                                        return [];
-                                    }
-                                    return ["请输入审批意见"];
-                                }
-                            }
-                        }
-                    ]
-                }}
-            >
-            </Form>
-        </>
-    )
-}
-
-export default FlowFormOpinion;
diff --git a/admin-pro-ui/src/components/flow/components/FlowHeader.tsx b/admin-pro-ui/src/components/flow/components/FlowHeader.tsx
deleted file mode 100644
index 99b6ce06..00000000
--- a/admin-pro-ui/src/components/flow/components/FlowHeader.tsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import React, {useContext} from "react";
-import FlowButton from "@/components/flow/components/FlowButton";
-import {FlowViewReactContext} from "@/components/flow/view";
-
-interface FlowHeaderProps{
-    setVisible:(visible:boolean)=>void;
-}
-
-// 流程详情header头信息
-const FlowHeader:React.FC<FlowHeaderProps> = (props)=>{
-    const flowViewReactContext = useContext(FlowViewReactContext);
-    const flowRecordContext =  flowViewReactContext?.flowRecordContext;
-    const currentNode = flowRecordContext?.getCurrentNode();
-
-    return (
-        <div className={"flow-header"}>
-            <div className={"flow-header-left"}>
-                {currentNode && currentNode.name}
-            </div>
-            <div className={"flow-header-right"}>
-                <FlowButton setVisible={props.setVisible}/>
-            </div>
-        </div>
-    )
-}
-
-export default FlowHeader;
diff --git a/admin-pro-ui/src/components/flow/components/FlowHistory.tsx b/admin-pro-ui/src/components/flow/components/FlowHistory.tsx
deleted file mode 100644
index 445efa37..00000000
--- a/admin-pro-ui/src/components/flow/components/FlowHistory.tsx
+++ /dev/null
@@ -1,167 +0,0 @@
-import React, {useContext} from "react";
-import {FlowViewReactContext} from "@/components/flow/view";
-import Descriptions from "@/components/descriptions";
-import {FormField} from "@codingapi/ui-framework";
-import moment from "moment";
-import {Tag} from "antd";
-
-const fields = [
-    {
-        type: 'input',
-        props: {
-            name: 'title',
-            label: '',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'createOperatorName',
-            label: '发起人',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'createOperatorDate',
-            label: '发起时间',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'flowStatus',
-            label: '状态',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'recodeType',
-            label: '流程状态',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'postponedCount',
-            label: '是否延期',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'interfere',
-            label: '是否干预',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'read',
-            label: '是否已读',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'timeoutTime',
-            label: '超时时间',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'nodeName',
-            label: '节点名称',
-        }
-    }
-] as FormField[];
-
-const flowStatusConvert = (data: any) => {
-    if (data.flowStatus === 'RUNNING') {
-        return '进行中';
-    }
-    if (data.flowStatus === 'FINISH') {
-        return '已结束';
-    }
-    return '';
-}
-
-const recodeTypeConvert = (data: any) => {
-    if (data.flowType === 'TODO') {
-        return <Tag color={'primary'}>待办</Tag>;
-    }
-    if (data.flowType === 'DONE') {
-        return <Tag color={'success'}>已办</Tag>;
-    }
-    if (data.flowType === 'TRANSFER') {
-        return <Tag color={'blue'}>已转办</Tag>;
-    }
-    return '';
-}
-
-const postponedCountConvert = (data: any) => {
-    if (data.postponedCount > 0) {
-        return '延期';
-    }
-    return '未延期';
-}
-
-const interfereConvert = (data: any) => {
-    if (data.interfere) {
-        return '干预';
-    }
-    return '未干预';
-}
-
-const readConvert = (data: any) => {
-    if (data.read) {
-        return '已读';
-    }
-    return '未读';
-}
-
-const timeoutTimeConvert = (data: any) => {
-    if (data.timeoutTime == 0) {
-        return '未设置';
-    }
-    return moment(data.timeoutTime).format("YYYY-MM-DD HH:mm:ss");
-}
-
-
-const FlowHistory = () => {
-    const flowViewReactContext = useContext(FlowViewReactContext);
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-
-    const currentFlowRecord = flowRecordContext?.getCurrentFlowRecord();
-
-    if(currentFlowRecord) {
-        return (
-            <div className={"flow-history"}>
-                <div className={"flow-basic"}>
-                    <Descriptions
-                        columns={fields}
-                        request={async () => {
-                            return {
-                                ...currentFlowRecord,
-                                createOperatorName: currentFlowRecord.createOperator?.name,
-                                createOperatorDate: moment(currentFlowRecord.createTime).format('YYYY-MM-DD HH:mm:ss'),
-                                flowStatus: flowStatusConvert(currentFlowRecord),
-                                recodeType: recodeTypeConvert(currentFlowRecord),
-                                postponedCount: postponedCountConvert(currentFlowRecord),
-                                interfere: interfereConvert(currentFlowRecord),
-                                read: readConvert(currentFlowRecord),
-                                timeoutTime: timeoutTimeConvert(currentFlowRecord),
-                                nodeName: flowRecordContext?.getNode(currentFlowRecord.nodeCode)?.name,
-                            };
-                        }}
-                    />
-                </div>
-            </div>
-        )
-    }
-    return <></>
-}
-
-export default FlowHistory;
diff --git a/admin-pro-ui/src/components/flow/components/FlowHistoryLine.tsx b/admin-pro-ui/src/components/flow/components/FlowHistoryLine.tsx
deleted file mode 100644
index 6f3fd5bf..00000000
--- a/admin-pro-ui/src/components/flow/components/FlowHistoryLine.tsx
+++ /dev/null
@@ -1,55 +0,0 @@
-import React, {useContext} from "react";
-import {FlowViewReactContext} from "@/components/flow/view";
-import moment from "moment";
-import {Tag} from "antd";
-
-const recodeTypeConvert = (data: any) => {
-    if (data.flowType === 'TODO') {
-        return <Tag color={'primary'}>待办</Tag>;
-    }
-    if (data.flowType === 'DONE') {
-        return <Tag color={'success'}>已办</Tag>;
-    }
-    if (data.flowType === 'TRANSFER') {
-        return <Tag color={'blue'}>已转办</Tag>;
-    }
-    return '';
-}
-
-
-const FlowHistoryLine = () => {
-    const flowViewReactContext = useContext(FlowViewReactContext);
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-
-    const historyRecords = flowRecordContext?.getHistoryRecords();
-
-    return (
-        <div className={"flow-history"}>
-            <div className={"flow-history-list"}>
-                {historyRecords && historyRecords.map((historyRecord: any, index: number) => {
-                    const nodeName = flowRecordContext?.getNode(historyRecord.nodeCode)?.name;
-                    const recodeType = recodeTypeConvert(historyRecord);
-                    const createName = historyRecord.createOperator?.name;
-                    const createTime = moment(historyRecord.createTime).format('YYYY-MM-DD HH:mm:ss');
-                    const flowAdvice = historyRecord.opinion?.advice || '暂无意见';
-                    return (
-                        <div className={"flow-history-list-item"}>
-                            <div className={"flow-history-list-item-line"}>
-                                {historyRecords.length > (index + 1) &&  <div className={"flow-history-list-item-dot"}/>}
-                            </div>
-                            <div className={"flow-history-list-item-content"}>
-                                <div className={"flow-history-list-item-title"}>{nodeName}</div>
-                                <div className={"flow-history-list-item-attr"}>状态:{recodeType}</div>
-                                <div className={"flow-history-list-item-attr"}>创建人:{createName}</div>
-                                <div className={"flow-history-list-item-attr"}>创建时间:{createTime}</div>
-                                <div className={"flow-history-list-item-attr"}>审批意见:{flowAdvice}</div>
-                            </div>
-                        </div>
-                    )
-                })}
-            </div>
-        </div>
-    )
-}
-
-export default FlowHistoryLine;
diff --git a/admin-pro-ui/src/components/flow/components/FlowOpinion.tsx b/admin-pro-ui/src/components/flow/components/FlowOpinion.tsx
deleted file mode 100644
index 4ff19b83..00000000
--- a/admin-pro-ui/src/components/flow/components/FlowOpinion.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import React, {useContext} from "react";
-import {FlowViewReactContext} from "@/components/flow/view";
-import moment from "moment";
-
-
-const optionStateConvert = (data: any) => {
-    if (data.opinion.result === 1) {
-        return '转办'
-    }
-    if (data.opinion.result === 2) {
-        return '通过'
-    }
-    if (data.opinion.result === 3) {
-        return '驳回'
-    }
-    return '暂存'
-}
-
-const FlowOpinion = () => {
-
-    const flowViewReactContext = useContext(FlowViewReactContext);
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-
-    const historyOpinions = flowRecordContext?.getHistoryOpinions();
-
-    return (
-        <>
-            {historyOpinions && historyOpinions.map((item: any) => {
-                const flowOperatorName = item.operator.name;
-                const optionState = optionStateConvert(item);
-                const createTime = moment(item.createTime).format("YYYY-MM-DD HH:mm:ss");
-                const advice = item.opinion.advice;
-                return (
-                    <div className={"flow-history-opinion-item"}>
-                        <div className={"flow-history-opinion-item-row"}>
-                            <span>审批人：</span>
-                            <span>{flowOperatorName} {optionState}</span>
-                        </div>
-                        <div className={"flow-history-opinion-item-row"}>
-                            <span>审批时间：</span>
-                            <span>{createTime}</span>
-                        </div>
-                        <div className={"flow-history-opinion-item-row"}>
-                            <span>审批意见：</span>
-                            <span>{advice}</span>
-                        </div>
-                    </div>
-                )
-            })}
-        </>
-    )
-}
-
-export default FlowOpinion;
diff --git a/admin-pro-ui/src/components/flow/components/FlowPage.tsx b/admin-pro-ui/src/components/flow/components/FlowPage.tsx
deleted file mode 100644
index c53b249d..00000000
--- a/admin-pro-ui/src/components/flow/components/FlowPage.tsx
+++ /dev/null
@@ -1,134 +0,0 @@
-import React, {useEffect} from "react";
-import {
-    FlowFormViewProps,
-    FlowViewProps,
-    PostponedFormProps,
-    PostponedFormViewKey,
-    UserSelectFormProps,
-    UserSelectFormViewKey
-} from "@/components/flow/types";
-import {FlowReduxState, updateState} from "@/components/flow/store/FlowSlice";
-import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
-import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
-import {Form} from "@codingapi/form-pc";
-import {FlowRecordContext} from "@/components/flow/domain/FlowRecordContext";
-import {useDispatch, useSelector} from "react-redux";
-import {FlowEventContext} from "@/components/flow/domain/FlowEventContext";
-import {FlowButtonClickContext} from "@/components/flow/domain/FlowButtonClickContext";
-import {FlowViewReactContext} from "../view";
-import FlowResult from "@/components/flow/components/FlowResult";
-import FlowContent from "@/components/flow/components/FlowContent";
-import FlowForm404 from "@/components/flow/components/FlowForm404";
-import FlowHeader from "@/components/flow/components/FlowHeader";
-import {ComponentBus} from "@codingapi/ui-framework";
-
-
-interface FlowPageProps extends FlowViewProps {
-    // 流程详情数据
-    flowData: any;
-}
-
-const FlowPage:React.FC<FlowPageProps> = (props)=>{
-
-    const dispatch = useDispatch();
-
-    const currentState = useSelector((state: FlowReduxState) => state.flow);
-    const flowRecordContext = new FlowRecordContext(props, props.flowData);
-    const formInstance = Form.useForm();
-    const opinionInstance = Form.useForm();
-
-    const flowStateContext = new FlowStateContext(currentState, (state: any) => {
-        dispatch(updateState({
-            ...state
-        }));
-    });
-    const flowTriggerContext = new FlowTriggerContext();
-    const flowEvenContext = new FlowEventContext(flowRecordContext, flowTriggerContext, formInstance, opinionInstance, flowStateContext);
-    const flowButtonClickContext = new FlowButtonClickContext(flowEvenContext, flowStateContext);
-    const FlowFormView = flowRecordContext.getFlowFormView() as React.ComponentType<FlowFormViewProps>;
-
-    // 延期表单视图
-    const PostponedFormView = ComponentBus.getInstance().getComponent<PostponedFormProps>(PostponedFormViewKey);
-    // 选人表单视图
-    const UserSelectFormView = ComponentBus.getInstance().getComponent<UserSelectFormProps>(UserSelectFormViewKey);
-
-    const version = useSelector((state: FlowReduxState) => state.flow.version);
-
-    // 设置流程编号
-    useEffect(() => {
-        if (props.id) {
-            flowStateContext.setRecordId(props.id);
-        }
-    }, [version]);
-
-    if (FlowFormView) {
-        return (
-            <FlowViewReactContext.Provider value={{
-                flowRecordContext: flowRecordContext,
-                flowEventContext: flowEvenContext,
-                flowStateContext: flowStateContext,
-                flowTriggerContext: flowTriggerContext,
-                flowButtonClickContext: flowButtonClickContext,
-
-                formInstance: formInstance,
-                opinionInstance: opinionInstance
-            }}>
-                <div className={"flow-view"}>
-                    <FlowHeader setVisible={props.setVisible}/>
-
-                    {currentState.result && (
-                        <FlowResult/>
-                    )}
-                    <FlowContent/>
-                </div>
-
-                {PostponedFormView && (
-                    <PostponedFormView
-                        visible={currentState.postponedVisible}
-                        setVisible={(visible: boolean) => {
-                            flowStateContext.setPostponedVisible(visible);
-                        }}
-                        onFinish={(timeOut) => {
-                            flowEvenContext.postponedFlow(timeOut, (res) => {
-                                flowStateContext.setResult({
-                                    title: '延期成功',
-                                    state: 'success',
-                                    closeable: true,
-                                    items: [
-                                        {
-                                            label: '延期时间',
-                                            value: `${timeOut}小时`
-                                        }
-                                    ]
-                                })
-                            });
-                        }}
-                    />
-                )}
-
-                {UserSelectFormView && currentState.userSelectMode && (
-                    <UserSelectFormView
-                        visible={currentState.userSelectVisible}
-                        setVisible={(visible: boolean) => {
-                            flowStateContext.setUserSelectVisible(visible);
-                        }}
-                        onFinish={(users) => {
-                            // 选择的人
-                            flowEvenContext.userSelectCallback(users, currentState.userSelectMode);
-                        }}
-                        multiple={currentState.userSelectMode.multiple}
-                        specifyUserIds={currentState.userSelectMode.specifyUserIds}
-                        currentUserIds={currentState.userSelectMode.currentUserIds}
-                        userSelectType={currentState.userSelectMode.userSelectType}
-                    />
-                )}
-
-            </FlowViewReactContext.Provider>
-        )
-    }
-    return (
-        <FlowForm404 setVisible={props.setVisible}/>
-    )
-}
-
-export default FlowPage;
diff --git a/admin-pro-ui/src/components/flow/components/FlowResult.tsx b/admin-pro-ui/src/components/flow/components/FlowResult.tsx
deleted file mode 100644
index e01379e8..00000000
--- a/admin-pro-ui/src/components/flow/components/FlowResult.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import React, {useContext} from "react";
-import {useSelector} from "react-redux";
-import {FlowReduxState} from "@/components/flow/store/FlowSlice";
-import {useNavigate} from "react-router";
-import {FlowViewReactContext} from "@/components/flow/view";
-import {Button, Result} from "antd";
-
-
-const FlowResult = () => {
-
-    const result = useSelector((state: FlowReduxState) => state.flow.result);
-    const navigate = useNavigate();
-
-    const flowViewReactContext = useContext(FlowViewReactContext);
-
-    return (
-        <Result
-            status={result?.state}
-            title={result?.title}
-        >
-            <div className={"flow-result-content"}>
-                {result && result.items && result.items.map((item) => {
-                    return (
-                        <div className={"flow-result-content-item"}>
-                            <div className={"flow-result-content-item-label"}>{item.label}:</div>
-                            <div className={"flow-result-content-item-value"}>{item.value}</div>
-                        </div>
-                    )
-                })}
-
-                <div className={"flow-result-content-footer"}>
-                    <Button
-                        className={"flow-result-content-button"}
-                        block={true}
-                        onClick={() => {
-                            if (result && result.closeable) {
-                                navigate(-1);
-                            }else {
-                                flowViewReactContext?.flowStateContext?.clearResult();
-                            }
-                        }}
-                    >关闭页面</Button>
-                </div>
-            </div>
-        </Result>
-    )
-}
-
-export default FlowResult;
diff --git a/admin-pro-ui/src/components/flow/domain/FlowButtonClickContext.ts b/admin-pro-ui/src/components/flow/domain/FlowButtonClickContext.ts
deleted file mode 100644
index d1fd38ba..00000000
--- a/admin-pro-ui/src/components/flow/domain/FlowButtonClickContext.ts
+++ /dev/null
@@ -1,316 +0,0 @@
-import {FlowButton} from "@/components/flow/types";
-import {FlowSubmitResultParser, FlowTrySubmitResultParser} from "@/components/flow/domain/FlowResultParser";
-import {FlowEventContext} from "@/components/flow/domain/FlowEventContext";
-import {FlowStateContext} from "./FlowStateContext";
-import {message} from "antd";
-
-// 流程按钮事件点击触发器
-export class FlowButtonClickContext {
-
-    private readonly flowEventContext: FlowEventContext;
-    private readonly flowStateContext: FlowStateContext;
-
-    constructor(flowEventContext: FlowEventContext,
-                flowStateContext: FlowStateContext) {
-        this.flowEventContext = flowEventContext;
-        this.flowStateContext = flowStateContext;
-    }
-
-
-    /**
-     * 触发刷新动作
-     */
-    handlerReload(){
-        this.flowEventContext?.reloadFlow();
-    }
-
-    /**
-     * 触发保存动作
-     */
-    handlerSave(){
-        if (this.flowStateContext?.hasRecordId()) {
-            this.flowEventContext?.saveFlow(() => {
-                message.info('流程保存成功').then();
-            })
-        } else {
-            this.flowEventContext?.startFlow(() => {
-                this.flowEventContext?.saveFlow(() => {
-                    message.info('流程保存成功').then();
-                })
-            });
-        }
-    }
-
-    /**
-     * 触发发起动作
-     */
-    handlerStart(){
-        if (this.flowStateContext?.hasRecordId()) {
-            message.info('流程已发起，无需重复发起').then();
-        } else {
-            this.flowEventContext?.startFlow((res) => {
-                message.info('流程发起成功.').then();
-            })
-        }
-    }
-
-    /**
-     * 指定人提交流程
-     * @param approvalState 审批状态 同意为true 驳回为false
-     * @param operatorIds 流程操作人员id
-     */
-    handlerSpecifyOperatorSubmit(approvalState:boolean,operatorIds:number[]){
-        this.flowEventContext?.submitFlow(true, (res) => {
-            const flowSubmitResultParser = new FlowSubmitResultParser(res.data);
-            this.flowStateContext.setResult(flowSubmitResultParser.parser());
-        }, operatorIds);
-    }
-
-    /**
-     * 触发指定人提交动作
-     */
-    handlerSpecifySubmit(){
-        const trySpecifySubmitHandler = ()=>{
-            this.flowEventContext?.trySubmitFlow((res) => {
-                const operators = res.data.operators;
-                const userIds = operators.map((item: any) => {
-                    return item.userId;
-                });
-                this.flowStateContext?.setUserSelectMode({
-                    userSelectType: 'nextNodeUser',
-                    multiple: true,
-                    specifyUserIds: userIds,
-                });
-            });
-        }
-        if (this.flowStateContext?.hasRecordId()) {
-            trySpecifySubmitHandler();
-        }else {
-            this.flowEventContext?.startFlow(() => {
-                trySpecifySubmitHandler();
-            });
-        }
-    }
-
-    /**
-     * 触发提交动作
-     */
-    handlerSubmit(){
-        const submitHandler = ()=>{
-            this.flowEventContext?.submitFlow(true, (res) => {
-                const flowSubmitResultParser = new FlowSubmitResultParser(res.data);
-                this.flowStateContext?.setResult(flowSubmitResultParser.parser());
-            })
-        }
-        if (this.flowStateContext?.hasRecordId()) {
-            submitHandler();
-        } else {
-            this.flowEventContext?.startFlow(() => {
-                submitHandler();
-            });
-        }
-    }
-
-    /**
-     * 触发驳回动作
-     */
-    handlerReject(){
-        if (this.flowStateContext?.hasRecordId()) {
-            this.flowEventContext?.submitFlow(false, (res) => {
-                const flowSubmitResultParser = new FlowSubmitResultParser(res.data);
-                this.flowStateContext?.setResult(flowSubmitResultParser.parser());
-            })
-        } else {
-            message.info('流程尚未发起，无法操作').then();
-        }
-    }
-
-    /**
-     * 触发尝试提交动作
-     */
-    handlerTrySubmit(){
-        const trySubmitHandler = ()=>{
-            this.flowEventContext?.trySubmitFlow((res) => {
-                const flowTrySubmitResultParser = new FlowTrySubmitResultParser(res.data);
-                this.flowStateContext?.setResult(flowTrySubmitResultParser.parser());
-            });
-        }
-        if (this.flowStateContext?.hasRecordId()) {
-            trySubmitHandler();
-        }else {
-            this.flowEventContext?.startFlow(() => {
-                trySubmitHandler();
-            });
-        }
-    }
-
-    /**
-     * 触发撤回动作
-     */
-    handlerRecall(){
-        this.flowEventContext?.recallFlow(() => {
-            this.flowStateContext?.setResult({
-                state: 'success',
-                closeable: true,
-                title: '流程撤回成功',
-            });
-        });
-    }
-
-    /**
-     * 触发删除动作
-     */
-    handlerRemove(){
-        if (this.flowStateContext?.hasRecordId()) {
-            this.flowEventContext?.removeFlow(() => {
-                this.flowStateContext?.setResult({
-                    state: 'success',
-                    closeable: true,
-                    title: '流程删除成功',
-                });
-            });
-        } else {
-            message.info('流程尚未发起，无法删除').then();
-        }
-    }
-
-    /**
-     * 触发催办动作
-     */
-    handlerUrge(){
-        this.flowEventContext?.urgeFlow(() => {
-            this.flowStateContext?.setResult({
-                state: 'success',
-                closeable: true,
-                title: '催办提醒已发送',
-            });
-        });
-    }
-
-    /**
-     * 触发延期动作
-     */
-    handlerPostponed(){
-        if (this.flowStateContext?.hasRecordId()) {
-            this.flowStateContext?.setPostponedVisible(true);
-        }else {
-            message.info('流程尚未发起，无法操作').then();
-        }
-    }
-
-    /**
-     * 触发转办动作
-     */
-    handlerTransfer(){
-        if (this.flowStateContext?.hasRecordId()) {
-            this.flowStateContext?.setUserSelectMode({
-                userSelectType: 'transfer',
-                multiple: false,
-            });
-        }else {
-            message.info('流程尚未发起，无法操作').then();
-        }
-    }
-
-    /**
-     * 触发自定义接口动作
-     * @param buttonId 自定义按钮的id
-     */
-    handlerCustom(buttonId:string){
-        const customHandler = ()=>{
-            this.flowEventContext?.customFlow(buttonId, (res) => {
-                const customMessage = res.data;
-                this.flowStateContext?.setResult({
-                    state: customMessage.resultState.toLowerCase(),
-                    ...customMessage
-                });
-            });
-        }
-        if (this.flowStateContext?.hasRecordId()) {
-            customHandler();
-        } else {
-            this.flowEventContext?.startFlow((res) => {
-                customHandler();
-            });
-        }
-    }
-
-    /**
-     * 触发自定义前端动作
-     * @param eventKey 自定义按钮的事件key
-     */
-    handlerView(eventKey:string){
-        const viewHandler = ()=>{
-            this.flowEventContext?.triggerEvent(eventKey);
-        }
-
-        if (this.flowStateContext?.hasRecordId()) {
-            viewHandler();
-        }else {
-            this.flowEventContext?.startFlow((res) => {
-                viewHandler();
-            });
-        }
-    }
-
-    /**
-     * 处理按钮点击事件
-     * @param button
-     */
-    handlerClick(button: FlowButton) {
-        if (button.type === "RELOAD") {
-            this.handlerReload();
-        }
-
-        if (button.type === 'SAVE') {
-            this.handlerSave();
-        }
-
-        if (button.type === "START") {
-            this.handlerStart();
-        }
-        if (button.type === 'SPECIFY_SUBMIT') {
-            this.handlerSpecifySubmit();
-        }
-
-        if (button.type === 'SUBMIT') {
-            this.handlerSubmit();
-        }
-
-        if (button.type === 'REJECT') {
-            this.handlerReject();
-        }
-
-        if (button.type === 'TRY_SUBMIT') {
-            this.handlerTrySubmit();
-        }
-
-        if (button.type === 'RECALL') {
-            this.handlerRecall();
-        }
-
-        if (button.type === 'REMOVE') {
-            this.handlerRemove();
-        }
-
-        if (button.type === 'URGE') {
-            this.handlerUrge()
-        }
-
-        if (button.type === 'POSTPONED') {
-            this.handlerPostponed();
-        }
-
-        if (button.type === 'TRANSFER') {
-            this.handlerTransfer();
-        }
-
-        if (button.type === "CUSTOM") {
-            this.handlerCustom(button.id);
-        }
-
-        if (button.type === 'VIEW') {
-            this.handlerView(button.eventKey);
-        }
-    }
-}
diff --git a/admin-pro-ui/src/components/flow/domain/FlowContext.ts b/admin-pro-ui/src/components/flow/domain/FlowContext.ts
deleted file mode 100644
index f2fe720c..00000000
--- a/admin-pro-ui/src/components/flow/domain/FlowContext.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import FlowPanelContext from "@/components/flow/domain/FlowPanelContext";
-
-class FlowContext{
-
-    private flowPanelContext: FlowPanelContext | null = null;
-
-    private constructor() {
-    }
-
-    private static instance: FlowContext = new FlowContext();
-
-    static getInstance(){
-        return FlowContext.instance;
-    }
-
-    setFlowPanelContext(flowPanelContext: FlowPanelContext){
-        this.flowPanelContext = flowPanelContext;
-    }
-
-    getFlowPanelContext(){
-        return this.flowPanelContext;
-    }
-}
-
-export default FlowContext;
diff --git a/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts b/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts
deleted file mode 100644
index 73e5088f..00000000
--- a/admin-pro-ui/src/components/flow/domain/FlowEventContext.ts
+++ /dev/null
@@ -1,348 +0,0 @@
-import {FlowRecordContext} from "@/components/flow/domain/FlowRecordContext";
-import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
-import * as flowApi from "@/api/flow";
-import {FlowUser} from "@/components/flow/types";
-import {FlowSubmitResultParser} from "@/components/flow/domain/FlowResultParser";
-import {UserSelectMode} from "@/components/flow/store/FlowSlice";
-import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
-import {FormInstance} from "@codingapi/ui-framework";
-
-/**
- * 流程的事件控制上下文对象
- */
-export class FlowEventContext {
-
-    private readonly flowRecordContext: FlowRecordContext;
-    private readonly flowTriggerContext: FlowTriggerContext;
-    private readonly flowInstance: FormInstance;
-    private readonly opinionInstance: FormInstance;
-    private readonly flowStateContext: FlowStateContext;
-
-    constructor(flowViewContext: FlowRecordContext,
-                flowTriggerContext: FlowTriggerContext,
-                flowInstance: FormInstance,
-                opinionInstance: FormInstance,
-                flowStateContext: FlowStateContext) {
-        this.flowRecordContext = flowViewContext;
-        this.flowTriggerContext = flowTriggerContext;
-        this.flowInstance = flowInstance;
-        this.opinionInstance = opinionInstance;
-        this.flowStateContext = flowStateContext;
-    }
-
-    private getRequestBody = () => {
-        const formData = this.flowInstance.getFieldsValue();
-        const flowData = this.flowRecordContext.getFlowFormParams();
-        const workCode = this.flowRecordContext.getWorkCode();
-        const recordId = this.flowStateContext.getRecordId();
-        const advice = this.opinionInstance.getFieldsValue();
-
-        return {
-            recordId,
-            workCode,
-            ...advice,
-            formData: {
-                ...flowData,
-                ...formData,
-            }
-        }
-    }
-
-
-    private validateForm = async () => {
-        const formState = await this.flowInstance.validate();
-        const opinionState = await this.opinionInstance.validate();
-        return formState && opinionState;
-    }
-
-    /**
-     * 发起流程
-     * @param callback 回调函数
-     */
-    startFlow = (callback?: (res: any) => void) => {
-        const body = this.getRequestBody();
-        this.flowStateContext.setRequestLoading(true);
-        flowApi.startFlow(body)
-            .then(res => {
-                if (res.success) {
-                    const newRecordId = res.data.records[0].id;
-                    this.flowStateContext.setRecordId(newRecordId);
-
-                    if (callback) {
-                        callback(res);
-                    }
-                }
-            })
-            .finally(() => {
-                this.flowStateContext.setRequestLoading(false);
-            })
-    }
-
-
-    /**
-     * 提交流程
-     * @param approvalState 是否审批通过
-     * @param callback 回调函数
-     * @param operatorIds 指定审批人
-     */
-    submitFlow = (approvalState: boolean, callback?: (res: any) => void, operatorIds?: number[]) => {
-        this.validateForm().then((validateState) => {
-            if (validateState) {
-                const body = {
-                    ...this.getRequestBody(),
-                    success: approvalState,
-                    operatorIds: operatorIds,
-                }
-                this.flowStateContext.setRequestLoading(true);
-                flowApi.submitFlow(body)
-                    .then(res => {
-                        if (res.success) {
-                            if (callback) {
-                                callback(res);
-                            }
-                        }
-                    })
-                    .finally(() => {
-                        this.flowStateContext.setRequestLoading(false);
-                    })
-            }
-        })
-    }
-
-    /**
-     * 删除流程
-     * @param callback 回调函数
-     */
-    removeFlow = (callback?: (res: any) => void) => {
-        this.flowStateContext.setRequestLoading(true);
-        const body = {
-            recordId: this.flowStateContext.getRecordId()
-        };
-        flowApi.removeFlow(body).then(res => {
-            if (res.success) {
-                if (callback) {
-                    callback(res);
-                }
-            }
-        }).finally(() => {
-            this.flowStateContext.setRequestLoading(false);
-        })
-    }
-
-    /**
-     * 保存流程
-     * @param callback 回调函数
-     */
-    saveFlow = (callback?: (res: any) => void) => {
-        this.flowStateContext.setRequestLoading(true);
-        const body = this.getRequestBody();
-        flowApi.saveFlow(body).then(res => {
-            if (res.success) {
-                if (callback) {
-                    callback(res);
-                }
-            }
-        }).finally(() => {
-            this.flowStateContext.setRequestLoading(false);
-        })
-    }
-
-    /**
-     * 延期流程
-     * @param timeOut 延期时间
-     * @param callback 回调函数
-     */
-    postponedFlow(timeOut: number, callback?: (res: any) => void) {
-        this.flowStateContext.setRequestLoading(true);
-        const body = {
-            recordId: this.flowStateContext.getRecordId(),
-            timeOut
-        };
-        flowApi.postponed(body).then(res => {
-            if (res.success) {
-                if (callback) {
-                    callback(res);
-                }
-            }
-        }).finally(() => {
-            this.flowStateContext.setRequestLoading(false);
-        })
-    }
-
-    /**
-     * 自定义流程
-     * @param buttonId 自定义按钮Id
-     * @param callback 回调函数
-     */
-    customFlow(buttonId: string, callback?: (res: any) => void) {
-        this.validateForm().then((validateState) => {
-            console.log('validateState', validateState);
-            if (validateState) {
-                const body = {
-                    ...this.getRequestBody(),
-                    buttonId: buttonId,
-                }
-                this.flowStateContext.setRequestLoading(true);
-                flowApi.custom(body)
-                    .then(res => {
-                        if (res.success) {
-                            if (callback) {
-                                callback(res);
-                            }
-                        }
-                    })
-                    .finally(() => {
-                        this.flowStateContext.setRequestLoading(false);
-                    })
-            }
-        })
-    }
-
-    /**
-     * 转办流程
-     * @param user 转办用户
-     * @param callback 回调函数
-     */
-    transferFlow(user: FlowUser, callback?: (res: any) => void) {
-        this.validateForm().then((validateState) => {
-            if (validateState) {
-                const body = {
-                    ...this.getRequestBody(),
-                    targetUserId: user.id
-                }
-                this.flowStateContext.setRequestLoading(true);
-                flowApi.transfer(body)
-                    .then(res => {
-                        if (res.success) {
-                            if (callback) {
-                                callback(res);
-                            }
-                        }
-                    })
-                    .finally(() => {
-                        this.flowStateContext.setRequestLoading(false);
-                    })
-            }
-        })
-    }
-
-    /**
-     * 催办流程
-     * @param callback
-     */
-    urgeFlow(callback?: (res: any) => void) {
-        this.flowStateContext.setRequestLoading(true);
-        const body = {
-            recordId: this.flowStateContext.getRecordId()
-        };
-        flowApi.urge(body).then(res => {
-            if (res.success) {
-                if (callback) {
-                    callback(res);
-                }
-            }
-        }).finally(() => {
-            this.flowStateContext.setRequestLoading(false);
-        })
-    }
-
-    /**
-     * 撤回流程
-     */
-    recallFlow(callback?: (res: any) => void) {
-        this.flowStateContext.setRequestLoading(true);
-        const body = {
-            recordId: this.flowStateContext.getRecordId()
-        };
-        flowApi.recall(body).then(res => {
-            if (res.success) {
-                if (callback) {
-                    callback(res);
-                }
-            }
-        }).finally(() => {
-            this.flowStateContext.setRequestLoading(false);
-        })
-    }
-
-    /**
-     * 预提交流程
-     * @param callback
-     */
-    trySubmitFlow(callback?: (res: any) => void) {
-        this.validateForm().then((validateState) => {
-            if (validateState) {
-                const body = {
-                    ...this.getRequestBody(),
-                    success: true,
-                }
-                this.flowStateContext.setRequestLoading(true);
-                flowApi.trySubmitFlow(body)
-                    .then(res => {
-                        if (res.success) {
-                            if (callback) {
-                                callback(res);
-                            }
-                        }
-                    })
-                    .finally(() => {
-                        this.flowStateContext.setRequestLoading(false);
-                    })
-            }
-        })
-    }
-
-
-    /**
-     * 重新加载流程数据
-     */
-    reloadFlow() {
-        this.flowStateContext.randomVersion();
-    }
-
-
-    /**
-     * 触发流程事件
-     */
-    triggerEvent(eventKey: string) {
-        this.flowTriggerContext.triggerEvent(eventKey);
-    }
-
-    /**
-     * 用户选择回调
-     * @param users 选择用户
-     * @param userSelectMode 用户选择模式
-     */
-    userSelectCallback(users: FlowUser[], userSelectMode: UserSelectMode | null) {
-        if (users.length > 0) {
-            if (userSelectMode) {
-                if (userSelectMode.userSelectType === 'transfer') {
-                    const targetUser = users[0];
-                    this.transferFlow(targetUser, (res) => {
-                        const message = `已经成功转办给${targetUser.name}`;
-                        this.flowStateContext.setResult({
-                            state: 'success',
-                            closeable: true,
-                            title: message,
-                        });
-                    });
-                }
-                if (userSelectMode.userSelectType === 'nextNodeUser') {
-                    const userIds = users.map((item: any) => {
-                        return item.id;
-                    });
-                    this.submitFlow(true, (res) => {
-                        const flowSubmitResultParser = new FlowSubmitResultParser(res.data);
-                        this.flowStateContext.setResult(flowSubmitResultParser.parser());
-                    }, userIds);
-                }
-            }
-        }
-
-        this.flowStateContext.setUserSelectVisible(false);
-    }
-
-}
-
-
-
diff --git a/admin-pro-ui/src/components/flow/domain/FlowPanelContext.ts b/admin-pro-ui/src/components/flow/domain/FlowPanelContext.ts
deleted file mode 100644
index 2bdd5aa6..00000000
--- a/admin-pro-ui/src/components/flow/domain/FlowPanelContext.ts
+++ /dev/null
@@ -1,528 +0,0 @@
-import React from "react";
-import {LogicFlow} from "@logicflow/core";
-import {ButtonType, NodeButtonProperties, NodeProperties, NodeType} from "@/components/flow/types";
-import {message} from "antd";
-import {isEmpty} from "lodash-es";
-import NodeData = LogicFlow.NodeData;
-import RegisterConfig = LogicFlow.RegisterConfig;
-import GraphConfigData = LogicFlow.GraphConfigData;
-import GroovyScript from "@/components/flow/utils/script";
-
-// 节点移动距离
-const TRANSLATION_DISTANCE = 40
-
-// 逻辑面板上下文
-class FlowPanelContext {
-
-    private readonly lfRef: React.RefObject<LogicFlow>;
-
-    // 按钮事件选项
-    private readonly buttonEventOptions = [
-        {
-            label: "保存",
-            value: "SAVE"
-        },
-        {
-            label: "发起",
-            value: "START"
-        },
-        {
-            label: "提交",
-            value: "SUBMIT"
-        },
-        {
-            label: "预提交",
-            value: "TRY_SUBMIT"
-        },
-        {
-            label: "指定人员提交",
-            value: "SPECIFY_SUBMIT"
-        },
-        {
-            label: "驳回",
-            value: "REJECT"
-        },
-        {
-            label: "转办",
-            value: "TRANSFER"
-        },
-        {
-            label: "撤销",
-            value: "RECALL"
-        },
-        {
-            label: "延期",
-            value: "POSTPONED"
-        },
-        {
-            label: "催办",
-            value: "URGE"
-        },
-        {
-            label: "自定义接口",
-            value: "CUSTOM"
-        },
-        {
-            label: "自定义事件",
-            value: "VIEW"
-        },
-        {
-            label: "删除",
-            value: "REMOVE"
-        },
-    ] as {
-        label: string;
-        value: ButtonType;
-    }[];
-
-    constructor(lfRef: React.RefObject<LogicFlow>) {
-        this.lfRef = lfRef;
-    }
-
-    /**
-     * 获取按钮事件选项
-     * @param value 事件值
-     */
-    convertButtonValue = (value: string) => {
-        return this.buttonEventOptions.find(item => item.value === value)?.label;
-    }
-
-    /**
-     * 获取按钮事件选项
-     */
-    getButtonEventOptions() {
-        return this.buttonEventOptions;
-    }
-
-    /**
-     * 生成uuid
-     */
-    private generateUUID() {
-        return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
-            const r = (Math.random() * 16) | 0;
-            const v = c === 'x' ? r : (r & 0x3) | 0x8;
-            return v.toString(16);
-        });
-    }
-
-    /**
-     * 注册节点
-     * @param node
-     */
-    register(node: RegisterConfig) {
-        this.lfRef.current?.register(node);
-    }
-
-    /**
-     * 渲染数据
-     * @param data
-     */
-    render(data: GraphConfigData) {
-        this.lfRef.current?.render(data);
-    }
-
-    /**
-     * 获取节点信息
-     * @param nodeId 节点id
-     */
-    getNode(nodeId: string) {
-        const data = this.getGraphData();
-        if (data) {
-            //@ts-ignore
-            const nodes = data.nodes;
-            const getNode = (nodeId: string) => {
-                for (const node of nodes) {
-                    if (node.id === nodeId) {
-                        return node;
-                    }
-                }
-            }
-            return getNode(nodeId);
-        }
-        return null;
-    }
-
-    /**
-     * 获取节点按钮
-     * @param nodeId 节点id
-     */
-    getButtons(nodeId: string) {
-        const node = this.getNode(nodeId);
-        if (node) {
-            const buttons = node.properties.buttons || [];
-            buttons.sort((a: any, b: any) => {
-                return a.order - b.order;
-            })
-            return buttons;
-        }
-        return []
-    }
-
-
-    /**
-     * 删除节点按钮
-     * @param nodeId 节点id
-     * @param buttonId 按钮id
-     */
-    deleteButton(nodeId:string,buttonId:string){
-        const data = this.getGraphData();
-        if(data) {
-            //@ts-ignore
-            const nodes = data.nodes;
-            const getNode = (nodeId: String) => {
-                for (const node of nodes) {
-                    if (node.id === nodeId) {
-                        return node;
-                    }
-                }
-            }
-            const node = getNode(nodeId);
-            const buttons = node.properties.buttons || [];
-            node.properties.buttons = buttons.filter((item: any) => item.id !== buttonId);
-            this.render(data as GraphConfigData);
-        }
-    }
-
-    /**
-     * 更新节点按钮数据
-     */
-    updateButton(nodeId: string, button: NodeButtonProperties) {
-        const data = this.getGraphData();
-        if (data) {
-            //@ts-ignore
-            const nodes = data.nodes;
-            const getNode = (nodeId: String) => {
-                for (const node of nodes) {
-                    if (node.id === nodeId) {
-                        return node;
-                    }
-                }
-            }
-            const node = getNode(nodeId);
-            const buttons = node.properties.buttons || [];
-            let update = false;
-            for (const item of buttons) {
-                if (item.id == button.id) {
-                    item.name = button.name;
-                    item.style = button.style;
-                    item.type = button.type;
-                    item.order = button.order;
-                    item.groovy = button.groovy;
-                    item.eventKey = button.eventKey;
-                    update = true;
-                }
-            }
-            if (!update) {
-                button.id = this.generateUUID();
-                node.properties.buttons = [...buttons, button];
-            }
-            this.render(data as GraphConfigData);
-        }
-    }
-
-
-    /**
-     * 添加节点
-     * @param type 节点类型
-     * @param properties 节点属性
-     */
-    addNode(type: NodeType, properties: NodeProperties) {
-        if (this.nodeVerify(type)) {
-            const uid = this.generateUUID();
-            this.lfRef.current?.dnd.startDrag({
-                id: uid,
-                type: type,
-                properties: {
-                    ...properties,
-                    id: uid
-                }
-            })
-        }
-    }
-
-
-    /**
-     * 获取节点下的边
-     * @param nodeId 节点id
-     */
-    getEdges(nodeId: String) {
-        const data = this.getGraphData() as any;
-        const list = []
-        if(data) {
-            const nodes = data.nodes;
-            const getNodeProperties = (nodeId: String) => {
-                for (const node of nodes) {
-                    if (node.id === nodeId) {
-                        return node.properties;
-                    }
-                }
-            }
-
-            let update = false;
-
-            let order = 0;
-            if (data && data.edges) {
-                const edges = data.edges;
-                for (const index in edges) {
-                    const edge = edges[index];
-                    if (edge.sourceNodeId === nodeId) {
-                        order++;
-                        if (!edge.properties.outTrigger) {
-                            edge.properties = {
-                                ...edge.properties,
-                                outTrigger: GroovyScript.defaultOutTrigger,
-                                order: order,
-                                back: false
-                            }
-                            update = true;
-                        }
-
-                        list.push({
-                            id: edge.id,
-                            name: edge.properties.name,
-                            source: getNodeProperties(edge.sourceNodeId),
-                            target: getNodeProperties(edge.targetNodeId),
-                            outTrigger: edge.properties.outTrigger,
-                            back: edge.properties.back,
-                            order: edge.properties.order,
-                            edge
-                        });
-                    }
-                }
-            }
-
-            if (update) {
-                this.render(data);
-            }
-        }
-
-        return list;
-    }
-
-
-    /**
-     * 修改边的名称
-     * @param edgeId 边id
-     * @param name 名称
-     */
-    changeEdgeName(edgeId:string,name:string){
-        const data = this.getGraphData() as any;
-        if (data && data.edges) {
-            const edges = data.edges;
-            for (const index in edges) {
-                const edge = edges[index];
-                if (edge.id === edgeId) {
-                    edge.properties.name = name;
-                    this.render(data);
-                }
-            }
-        }
-    }
-
-
-    /**
-     * 修改边的排序
-     * @param edgeId 边id
-     * @param order 排序
-     */
-    changeEdgeOrder(edgeId:string,order:number){
-        const data = this.getGraphData() as any;
-        if (data && data.edges) {
-            const edges = data.edges;
-            for (const index in edges) {
-                const edge = edges[index];
-                if (edge.id === edgeId) {
-                    edge.properties.order = order;
-                    this.render(data);
-                }
-            }
-        }
-    }
-
-    /**
-     * 修改边的退回属性
-     * @param edgeId 边id
-     * @param back 是否退回
-     */
-    changeEdgeBack(edgeId:string,back:boolean){
-        const data = this.getGraphData() as any;
-        if (data && data.edges) {
-            const edges = data.edges;
-            for (const index in edges) {
-                const edge = edges[index];
-                if (edge.id === edgeId) {
-                    edge.properties.back = back;
-                    this.render(data);
-                }
-            }
-        }
-    }
-
-
-    /**
-     * 修改边的触发器
-     * @param edgeId 边id
-     * @param outTrigger 触发器
-     */
-    changeEdgeOutTrigger(edgeId:string,outTrigger:string){
-        const data = this.getGraphData() as any;
-        if (data && data.edges) {
-            const edges = data.edges;
-            for (const index in edges) {
-                const edge = edges[index];
-                if (edge.id === edgeId) {
-                    edge.properties.outTrigger = outTrigger;
-                    this.render(data);
-                }
-            }
-        }
-    }
-
-
-    /**
-     * 复制节点 控制位置的偏移
-     * @param nodeData
-     * @param distance
-     * @private
-     */
-    private translateNodeData(nodeData: NodeData, distance: number) {
-        nodeData.x += distance
-        nodeData.y += distance
-
-        if (!isEmpty(nodeData.text)) {
-            nodeData.text.x += distance
-            nodeData.text.y += distance
-        }
-
-        return nodeData
-    }
-
-
-    /**
-     * 从粘贴板中复制节点
-     */
-    copyNode = () => {
-        const flow = this.lfRef.current;
-        if (!flow) {
-            return;
-        }
-        const selected = flow.getSelectElements(true);
-        if (selected && (selected.nodes || selected.edges)) {
-            flow.clearSelectElements();
-            if (selected.nodes) {
-                const nodes = selected.nodes;
-                for (const node of nodes) {
-                    if (node.type === 'start-node') {
-                        message.error('开始节点只能有一个').then();
-                        return false;
-                    }
-                    if (node.type === 'over-node') {
-                        message.error('结束节点只能有一个').then();
-                        return false;
-                    }
-                }
-                const addElements = flow.addElements(
-                    selected,
-                    TRANSLATION_DISTANCE
-                );
-                if (!addElements) return true;
-                addElements.nodes.forEach((node) => flow.selectElementById(node.id, true));
-                addElements.nodes.forEach((node) => {
-                    this.translateNodeData(node, TRANSLATION_DISTANCE);
-                });
-            }
-        }
-        return false;
-    }
-
-
-    /**
-     * 节点校验
-     * @param type
-     */
-    private nodeVerify = (type: NodeType) => {
-        // @ts-ignore
-        const nodes = this.getGraphData().nodes;
-        if (type === 'start-node') {
-            for (let i = 0; i < nodes.length; i++) {
-                if (nodes[i].type === type) {
-                    message.error('开始节点只能有一个').then();
-                    return false;
-                }
-            }
-        }
-        if (type === 'over-node') {
-            for (let i = 0; i < nodes.length; i++) {
-                if (nodes[i].type === type) {
-                    message.error('结束节点只能有一个').then();
-                    return false;
-                }
-            }
-        }
-        return true;
-    }
-
-
-    /**
-     * 缩放
-     * @param flag true为放大 false为缩小
-     */
-    zoom = (flag: boolean) => {
-        this.lfRef.current?.zoom(flag);
-    }
-
-    /**
-     * 重置缩放
-     */
-    resetZoom = () => {
-        this.lfRef.current?.resetZoom();
-        this.lfRef.current?.resetTranslate();
-    }
-
-    /**
-     * 恢复 下一步
-     */
-    redo = () => {
-        this.lfRef.current?.redo();
-    }
-
-    /**
-     * 撤销 上一步
-     */
-    undo = () => {
-        this.lfRef.current?.undo();
-    }
-
-    /**
-     * 隐藏地图
-     */
-    hiddenMap = () => {
-        // @ts-ignore
-        this.lfRef.current?.extension.miniMap.hide();
-    }
-
-    /**
-     * 显示地图
-     */
-    showMap = () => {
-        const modelWidth = this.lfRef.current?.graphModel.width;
-        // @ts-ignore
-        this.lfRef.current?.extension.miniMap.show(modelWidth - 300, 200);
-    }
-
-    /**
-     * 下载图片
-     */
-    download = () => {
-        this.lfRef.current?.getSnapshot();
-    }
-
-    /**
-     * 获取流程设计的数据
-     */
-    getGraphData() {
-        return this.lfRef.current?.getGraphData();
-    }
-}
-
-export default FlowPanelContext;
diff --git a/admin-pro-ui/src/components/flow/domain/FlowRecordContext.ts b/admin-pro-ui/src/components/flow/domain/FlowRecordContext.ts
deleted file mode 100644
index 69fa1339..00000000
--- a/admin-pro-ui/src/components/flow/domain/FlowRecordContext.ts
+++ /dev/null
@@ -1,211 +0,0 @@
-import {FlowButton, FlowFormView, FlowViewProps} from "@/components/flow/types";
-
-/**
- * 流程的详情控制上下文对象
- */
-export class FlowRecordContext {
-
-    private readonly props: FlowViewProps;
-    private readonly data: any;
-
-    constructor(props: FlowViewProps, data?: any) {
-        this.props = props;
-        this.data = data;
-    }
-
-    // 获取流程的工作编码
-    getWorkCode() {
-        return this.data.flowWork.code;
-    }
-
-    // 获取流程的Form视图
-    getFlowFormView() {
-        const view = this.props.view;
-        if (typeof view === 'object') {
-            const nodeView = this.data.flowNode.view;
-            return (view as FlowFormView)[nodeView];
-        }
-        return view;
-    }
-
-
-    // 获取节点的数据
-    getNode = (code: string) => {
-        if (this.data) {
-            const nodes = this.data.flowWork.nodes;
-            for (const node of nodes) {
-                if (node.code === code) {
-                    return node;
-                }
-            }
-        }
-        return null;
-    }
-
-    // 获取当前的节点信息
-    getCurrentNode=()=>{
-        const currentNodeCode = this.getNodeCode();
-        return this.getNode(currentNodeCode);
-    }
-
-    // 获取当前节点的表单数据 （内部使用）
-    private getNodeState = (code: string) => {
-        const historyRecords = this.data.historyRecords || [];
-        if (code==='over' && this.isFinished()) {
-            return "done";
-        }
-        for (const record of historyRecords) {
-            if (record.nodeCode === code) {
-                if (record.flowType === 'TODO') {
-                    return "current";
-                }
-                return "done";
-            }
-        }
-        if(this.isFinished()){
-            return "undone";
-        }
-        return "wait";
-    }
-
-
-    // 获取历史记录
-    getHistoryRecords = () => {
-        return this.data.historyRecords;
-    }
-
-    // 获取当前的详情的记录数据
-    getCurrentFlowRecord = () => {
-        return this.data.flowRecord;
-    }
-
-    // 获取当前节点的流程图
-    getFlowSchema = () => {
-        if (this.data.flowWork.schema) {
-            const schema = JSON.parse(this.data.flowWork.schema);
-
-            for (const node of schema.nodes) {
-                node.properties.settingVisible = false;
-                node.properties.state = this.getNodeState(node.properties.code);
-            }
-            return schema;
-        }
-        return null;
-    }
-
-    // 获取审批意见
-    getOpinionAdvice = () => {
-        if(this.data.flowRecord){
-            if(this.data.flowRecord.opinion){
-                return this.data.flowRecord.opinion.advice;
-            }
-        }
-        return null;
-    }
-
-    // 获取历史审批意见
-    getHistoryOpinions() {
-        if(this.data.opinions){
-            return this.data.opinions.filter((item:any)=>{
-                if(!item.opinion){
-                    return false;
-                }
-                return item.opinion.result!==0;
-            });
-        }
-        return [];
-    }
-
-    //获取流程的form数据
-    getFlowFormParams() {
-        return {
-            ...this.data.bindData,
-            ...this.props.formParams
-        }
-    }
-
-    // 获取流程的操作按钮
-    getFlowButtons() {
-        const buttons = this.data.flowNode.buttons as FlowButton[] || [];
-        return buttons.sort((item1: any, item2: any) => {
-            return item1.order - item2.order;
-        })
-    }
-
-
-    // 是否可以审批
-    isApproval = () => {
-        return this.data.canHandle;
-    }
-
-    // 是否是开始节点
-    isStartNode = ()=>{
-        if (this.data) {
-            return this.data.flowNode.startNode;
-        }
-        return false;
-    }
-
-    // 获取当前节点的code
-    getNodeCode = () => {
-        if (this.data) {
-            return this.data.flowNode.code;
-        }
-        return null;
-    }
-
-    // 获取当前节点是否可编辑
-    isEditable = () => {
-        if(this.isFinished()){
-            return false;
-        }
-        if(this.isDone()){
-            return false;
-        }
-        return this.getFlowNodeEditable()
-    }
-
-    // 获取当前节点是否可编辑
-    getFlowNodeEditable = () => {
-        if (this.data) {
-            const node = this.data.flowNode;
-            if (node) {
-                return node.editable;
-            }
-        }
-        return false
-    }
-
-    // 是否已审批
-    isDone() {
-        if (this.data.flowRecord) {
-            return this.data.flowRecord.flowStatus === 'FINISH' || this.data.flowRecord.flowType === 'DONE';
-        }
-        return false;
-    }
-
-
-    // 是否完成
-    isFinished() {
-        if (this.data.flowRecord) {
-            return this.data.flowRecord.flowStatus === 'FINISH';
-        }
-        return false;
-    }
-
-
-    // 是否是退回状态
-    isReject(){
-        const historyRecords = this.data.historyRecords || [];
-        const currentRecord = this.data.flowRecord;
-        if(currentRecord && historyRecords.length>0){
-            const preId = currentRecord.preId;
-            const preRecord = historyRecords.find((item:any)=>item.id===preId);
-            if(preRecord){
-                return preRecord.flowSourceDirection === 'REJECT';
-            }
-        }
-        return false;
-    }
-
-}
diff --git a/admin-pro-ui/src/components/flow/domain/FlowResultParser.ts b/admin-pro-ui/src/components/flow/domain/FlowResultParser.ts
deleted file mode 100644
index 686e7c67..00000000
--- a/admin-pro-ui/src/components/flow/domain/FlowResultParser.ts
+++ /dev/null
@@ -1,92 +0,0 @@
-import {FlowResultMessage} from "@/components/flow/types";
-
-export class FlowWorkData {
-
-    protected readonly data: any;
-
-    constructor(data: any) {
-        this.data = data;
-    }
-
-    getNode = (code: string) => {
-        if (this.data) {
-            const nodes = this.data.flowWork.nodes;
-            for (const node of nodes) {
-                if (node.code === code) {
-                    return node;
-                }
-            }
-        }
-        return null;
-    }
-
-    getWorkCode() {
-        return this.data.flowWork.code;
-    }
-}
-
-
-export class FlowSubmitResultParser extends FlowWorkData {
-
-    constructor(data: any) {
-        super(data);
-    }
-
-    parser() {
-        const records = this.data.records;
-        const resultItems = [];
-        for (const record of records) {
-            const node = this.getNode(record.nodeCode);
-            resultItems.push({
-                label: '下级审批节点',
-                value: node.name
-            });
-
-            resultItems.push({
-                label: '下级审批人',
-                value: record.currentOperator.name
-            });
-        }
-        return {
-            title: '流程审批完成',
-            closeable: true,
-            state: 'success',
-            items: resultItems
-        } as FlowResultMessage;
-    }
-}
-
-
-export class FlowTrySubmitResultParser {
-
-    private readonly data: any;
-
-    constructor(data: any) {
-        this.data = data;
-    }
-
-    parser() {
-        const operators = this.data.operators;
-        const usernames = operators.map((item: any) => {
-            return item.name;
-        });
-        const flowResult = {
-            title: '下级节点提示',
-            closeable: false,
-            state: 'success',
-            items: [
-                {
-                    label: '下级审批节点',
-                    value: this.data.flowNode.name
-                },
-                {
-                    label: '下级审批人',
-                    value: usernames.join(',')
-                }
-            ]
-        }
-
-        return flowResult as FlowResultMessage;
-    }
-
-}
diff --git a/admin-pro-ui/src/components/flow/domain/FlowStateContext.tsx b/admin-pro-ui/src/components/flow/domain/FlowStateContext.tsx
deleted file mode 100644
index 5f2368c7..00000000
--- a/admin-pro-ui/src/components/flow/domain/FlowStateContext.tsx
+++ /dev/null
@@ -1,95 +0,0 @@
-import {FlowStore, UserSelectMode} from "@/components/flow/store/FlowSlice";
-import {FlowResultMessage} from "@/components/flow/types";
-
-/**
- * 流程的状态数据上下文对象
- */
-export class FlowStateContext {
-
-    private currentState: FlowStore;
-    private readonly updateFlowStore: (currentState: any) => any;
-
-    constructor(currentState: FlowStore, updateFlowStore: (state: any) => any) {
-        this.currentState = JSON.parse(JSON.stringify(currentState));
-        this.updateFlowStore = updateFlowStore;
-    }
-
-    private updateState() {
-        this.updateFlowStore({
-            ...this.currentState
-        })
-    }
-
-    setRequestLoading = (requestLoading: boolean) => {
-        this.currentState = {
-            ...this.currentState,
-            requestLoading
-        }
-        this.updateState();
-    }
-
-    setRecordId = (recordId: string) => {
-        this.currentState = {
-            ...this.currentState,
-            recordId
-        }
-        this.updateState();
-    }
-
-    setResult = (result: FlowResultMessage) => {
-        this.currentState = {
-            ...this.currentState,
-            result
-        }
-        this.updateState();
-    }
-
-    clearResult = () => {
-        this.currentState = {
-            ...this.currentState,
-            result: null
-        }
-        this.updateState();
-    }
-
-    hasRecordId = () => {
-        return this.currentState.recordId;
-    }
-
-    getRecordId = () => {
-        return this.currentState.recordId;
-    }
-
-    setPostponedVisible(visible: boolean) {
-        this.currentState = {
-            ...this.currentState,
-            postponedVisible: visible
-        }
-        this.updateState();
-    }
-
-    setUserSelectVisible(visible: boolean) {
-        this.currentState = {
-            ...this.currentState,
-            userSelectVisible: visible
-        }
-        this.updateState();
-    }
-
-    setUserSelectMode(userSelectMode: UserSelectMode) {
-        this.currentState = {
-            ...this.currentState,
-            userSelectVisible: true,
-            userSelectMode: userSelectMode
-        }
-        this.updateState();
-    }
-
-    randomVersion() {
-        this.currentState = {
-            ...this.currentState,
-            version: Math.random()
-        }
-        this.updateState();
-    }
-}
diff --git a/admin-pro-ui/src/components/flow/domain/FlowTriggerContext.ts b/admin-pro-ui/src/components/flow/domain/FlowTriggerContext.ts
deleted file mode 100644
index 7e673682..00000000
--- a/admin-pro-ui/src/components/flow/domain/FlowTriggerContext.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-export interface EventTrigger {
-    trigger: (eventKey: string) => void
-}
-
-// 流程事件触发器上下文对象
-export class FlowTriggerContext {
-
-    private list: EventTrigger[] = [];
-
-    constructor() {
-    }
-
-    // 添加触发器
-    addTrigger(trigger:(eventKey:string)=>void) {
-        this.list.push({
-            trigger
-        });
-    }
-
-    // 触发事件
-    triggerEvent(eventKey: string) {
-        this.list.forEach(trigger => {
-            trigger.trigger(eventKey);
-        })
-    }
-
-    clear() {
-        this.list = [];
-    }
-
-}
-
diff --git a/admin-pro-ui/src/components/flow/index.scss b/admin-pro-ui/src/components/flow/index.scss
deleted file mode 100644
index 1dff4c08..00000000
--- a/admin-pro-ui/src/components/flow/index.scss
+++ /dev/null
@@ -1,115 +0,0 @@
-/* 流程的背景色 */
-$flow-background-color: white;
-/* 流程的边框颜色 */
-$flow-box-shadow-color: rgb(228, 224, 219);
-
-/* 抄送节点的颜色 */
-$flow-circulate-color: #61aa1f;
-/* 流程节点的颜色 */
-$flow-node-color: #6855ef;
-/* 结束节点的颜色 */
-$flow-over-color: #ea3f21;
-/* 开始节点的颜色 */
-$flow-start-color: #b1ad30;
-
-/* 流程设计器的样式 */
-.flow-design {
-  border: 1px solid $flow-box-shadow-color;
-  transition: 0.3s;
-  padding: 15px 16px;
-  border-radius: 12px;
-  position: relative;
-
-  .flow-view {
-    width: 100%;
-    height: 85vh;
-  }
-}
-
-
-/* 流程节点的样式 */
-.flow-node {
-  display: flex;
-  align-items: center;
-  max-height: 40px;
-  border-radius: 12px;
-  padding: 10px;
-  position: relative;
-
-  .icon {
-    margin-left: 10px;
-    position: absolute;
-    font-size: 16px;
-    left: 0;
-  }
-
-  .code {
-    margin-left: 20px;
-    font-size: 14px;
-    color: #4a5e63;
-  }
-
-  .title {
-    margin-left: 5px;
-    font-size: 14px;
-    color: black;
-  }
-
-
-  .setting {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    right: 0;
-  }
-
-
-  .state {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    right: 0;
-  }
-}
-
-
-.circulate-node {
-  border: 1px solid $flow-circulate-color;
-  .icon {
-    color: $flow-circulate-color;
-  }
-  .setting {
-    color: $flow-circulate-color;
-  }
-}
-
-
-.node-node {
-  border: 1px solid $flow-node-color;
-  .icon {
-    color: $flow-node-color;
-  }
-  .setting {
-    color: $flow-node-color;
-  }
-}
-
-.over-node {
-  border: 1px solid $flow-over-color;
-  .icon {
-    color: $flow-over-color;
-  }
-  .setting {
-    color: $flow-over-color;
-  }
-}
-
-.start-node {
-  border: 1px solid $flow-start-color;
-  .icon {
-    color: $flow-start-color;
-  }
-  .setting {
-    color: $flow-start-color;
-  }
-}
diff --git a/admin-pro-ui/src/components/flow/index.tsx b/admin-pro-ui/src/components/flow/index.tsx
deleted file mode 100644
index 3d0ac497..00000000
--- a/admin-pro-ui/src/components/flow/index.tsx
+++ /dev/null
@@ -1,125 +0,0 @@
-import React, {useEffect, useRef} from "react";
-import '@logicflow/core/es/index.css';
-import '@logicflow/extension/lib/style/index.css';
-import {LogicFlow} from "@logicflow/core";
-import {DndPanel, Menu, MiniMap, Snapshot} from "@logicflow/extension";
-import Start from "@/components/flow/nodes/Start";
-import Node from "@/components/flow/nodes/Node";
-import Over from "@/components/flow/nodes/Over";
-import Circulate from "@/components/flow/nodes/Circulate";
-import ControlPanel from "@/components/flow/panel/ControlPanel";
-import NodePanel from "@/components/flow/panel/NodePanel";
-import {EdgeType} from "@/components/flow/types";
-
-import "./index.scss";
-import FlowPanelContext from "@/components/flow/domain/FlowPanelContext";
-import FlowContext from "@/components/flow/domain/FlowContext";
-
-export interface FlowActionType {
-    getData: () => any;
-}
-
-interface FlowProps {
-    data?: LogicFlow.GraphConfigData;
-    actionRef?: React.Ref<any>;
-    edgeType?: EdgeType;
-}
-
-
-const Flow: React.FC<FlowProps> = (props) => {
-
-    // 流程图背景颜色
-    const FLOW_BACKGROUND_COLOR = '#f3f5f8';
-    // 流程图的边颜色
-    const FLOW_EDGE_COLOR = '#8f94e3';
-    // 流程图的边宽度
-    const FLOW_EDGE_STROKE_WIDTH = 1;
-
-    const container = useRef<HTMLDivElement>(null);
-    const lfRef = useRef<LogicFlow>(null);
-    const edgeType = props.edgeType || 'polyline';
-
-    const flowPanelContext = new FlowPanelContext(lfRef);
-    FlowContext.getInstance().setFlowPanelContext(flowPanelContext);
-
-    if (props.actionRef) {
-        React.useImperativeHandle(props.actionRef, () => ({
-            getData: () => {
-                return flowPanelContext.getGraphData();
-            }
-        }), [props]);
-    }
-
-    const data = props?.data || {};
-    useEffect(() => {
-        const SilentConfig = {
-            isSilentMode: false,
-            stopScrollGraph: true,
-            stopMoveGraph: true,
-            stopZoomGraph: true,
-            edgeTextEdit: false,
-        };
-
-        //@ts-ignore
-        lfRef.current = new LogicFlow({
-            //@ts-ignore
-            container: container.current,
-            ...SilentConfig,
-            background: {
-                backgroundColor: FLOW_BACKGROUND_COLOR
-            },
-            plugins: [Menu, DndPanel, MiniMap, Snapshot],
-            grid: false,
-            keyboard: {
-                enabled: true,
-                shortcuts: [
-                    {
-                        keys: ['ctrl + v', 'cmd + v'],
-                        callback: (e) => {
-                            flowPanelContext.copyNode();
-                        }
-                    },
-
-                ]
-            },
-            edgeType: edgeType,
-        });
-
-        lfRef.current.setTheme({
-            bezier: {
-                stroke: FLOW_EDGE_COLOR,
-                strokeWidth: FLOW_EDGE_STROKE_WIDTH,
-            },
-            polyline: {
-                stroke: FLOW_EDGE_COLOR,
-                strokeWidth: FLOW_EDGE_STROKE_WIDTH,
-            },
-            line: {
-                stroke: FLOW_EDGE_COLOR,
-                strokeWidth: FLOW_EDGE_STROKE_WIDTH,
-            },
-        });
-
-        flowPanelContext.register(Start);
-        flowPanelContext.register(Node);
-        flowPanelContext.register(Over);
-        flowPanelContext.register(Circulate);
-        flowPanelContext.render(data);
-
-        lfRef.current.on('node:add', (data) => {
-            console.log('node:add', data);
-        });
-
-    }, []);
-
-    return (
-        <div className="flow-design">
-            <NodePanel/>
-            <ControlPanel/>
-
-            <div className={"flow-view"} ref={container}/>
-        </div>
-    )
-};
-
-export default Flow;
diff --git a/admin-pro-ui/src/components/flow/nodes/Circulate/index.tsx b/admin-pro-ui/src/components/flow/nodes/Circulate/index.tsx
deleted file mode 100644
index 7416be6c..00000000
--- a/admin-pro-ui/src/components/flow/nodes/Circulate/index.tsx
+++ /dev/null
@@ -1,140 +0,0 @@
-import {HtmlNode, HtmlNodeModel} from '@logicflow/core';
-import React from "react";
-import ReactDOM from "react-dom/client";
-import {InboxOutlined, SettingFilled} from "@ant-design/icons";
-import CirculateSettingPanel from "@/components/flow/nodes/panel/circulate";
-import StateTag from "@/components/flow/nodes/panel/StateTag";
-import {NodeState} from "@/components/flow/types";
-
-type CirculateProperties = {
-    id: string;
-    name: string;
-    code: string;
-    type: string;
-    view: string;
-    operatorMatcher: string;
-    editable: boolean;
-    titleGenerator: string;
-    errTrigger: string;
-    approvalType: string;
-    timeout: number;
-    settingVisible?: boolean;
-    state?: NodeState;
-}
-
-interface CirculateProps {
-    name: string;
-    code?: string;
-    update?: (values: any) => void;
-    settingVisible?: boolean;
-    properties?: CirculateProperties;
-}
-
-export const CirculateView: React.FC<CirculateProps> = (props) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const state = props.properties?.state;
-
-    return (
-        <div className="flow-node circulate-node">
-            <InboxOutlined
-                className={"icon"}
-            />
-            <div>
-                <span className={"code"}>
-                    {props.code && (
-                        <>({props.code})</>
-                    )}
-                </span>
-                <span className={"title"}>{props.name}</span>
-            </div>
-
-            {props.settingVisible && (
-                <SettingFilled
-                    className={"setting"}
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-
-            {state && (
-                <div className={"state"}>
-                    <StateTag
-                        state={state}/>
-                </div>
-            )}
-
-            <CirculateSettingPanel
-                visible={visible}
-                setVisible={setVisible}
-                properties={props.properties}
-                onSettingChange={(values) => {
-                    props.update && props.update(values);
-                }}
-            />
-        </div>
-    );
-}
-
-class CirculateModel extends HtmlNodeModel {
-    setAttributes() {
-        const name = this.properties.name as string;
-        this.width = 200 + name.length * 10;
-        this.height = 45;
-        this.text.editable = false;
-        this.menu = [];
-
-        this.sourceRules = [
-            {
-                message: `不允许输出`,
-                validate: (sourceNode: any, targetNode: any, sourceAnchor, targetAnchor) => {
-                    const edges = this.graphModel.getNodeOutgoingEdge(sourceNode.id);
-                    if (edges.length >= 1) {
-                        return false;
-                    } else {
-                        return true;
-                    }
-                },
-            },
-        ];
-
-        this.anchorsOffset = [
-            [this.width / 2, 0],
-            [0, this.height / 2],
-            [-this.width / 2, 0],
-            [0, -this.height / 2],
-        ];
-    }
-
-
-}
-
-class CirculateNode extends HtmlNode {
-    setHtml(rootEl: SVGForeignObjectElement) {
-        const {properties} = this.props.model as HtmlNodeModel<CirculateProperties>;
-        const div = document.createElement('div');
-        const settingVisible = properties.settingVisible !== false;
-        ReactDOM.createRoot(div).render(
-            <CirculateView
-                name={properties.name}
-                code={properties.code}
-                properties={properties}
-                settingVisible={settingVisible}
-                update={async (values) => {
-                    this.props.model.setProperties(values);
-                }}/>,
-        );
-        //需要清空
-        rootEl.innerHTML = '';
-        rootEl.appendChild(div);
-        super.setHtml(rootEl);
-    }
-}
-
-export default {
-    type: 'circulate-node',
-    view: CirculateNode,
-    model: CirculateModel,
-};
-
diff --git a/admin-pro-ui/src/components/flow/nodes/Node/index.tsx b/admin-pro-ui/src/components/flow/nodes/Node/index.tsx
deleted file mode 100644
index 14b01715..00000000
--- a/admin-pro-ui/src/components/flow/nodes/Node/index.tsx
+++ /dev/null
@@ -1,129 +0,0 @@
-import {HtmlNode, HtmlNodeModel} from '@logicflow/core';
-import React from "react";
-import ReactDOM from "react-dom/client";
-import {PlusCircleFilled, SettingFilled} from "@ant-design/icons";
-import NodeSettingPanel from "@/components/flow/nodes/panel/node";
-import StateTag from "@/components/flow/nodes/panel/StateTag";
-import {NodeState} from "@/components/flow/types";
-
-type NodeProperties = {
-    id: string;
-    name: string;
-    code: string;
-    type: string;
-    view: string;
-    operatorMatcher: string;
-    editable: boolean;
-    titleGenerator: string;
-    errTrigger: string;
-    approvalType: string;
-    timeout: number;
-    settingVisible?: boolean;
-    state?: NodeState;
-}
-
-interface NodeProps {
-    name: string;
-    code?: string;
-    update?: (values: any) => void;
-    settingVisible?: boolean;
-    properties?: NodeProperties;
-    state?: NodeState;
-}
-
-export const NodeView: React.FC<NodeProps> = (props) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const state = props.properties?.state;
-
-    return (
-        <div className="flow-node node-node">
-            <PlusCircleFilled
-                className={"icon"}
-            />
-            <div>
-                <span className={"code"}>
-                    {props.code && (
-                        <>({props.code})</>
-                    )}
-                </span>
-                <span className={"title"}>{props.name}</span>
-            </div>
-
-            {props.settingVisible && (
-                <SettingFilled
-                    className={"setting"}
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-
-            {state && (
-                <div className={"state"}>
-                    <StateTag
-                        state={state}/>
-                </div>
-            )}
-
-            <NodeSettingPanel
-                visible={visible}
-                setVisible={setVisible}
-                properties={props.properties}
-                onSettingChange={(values) => {
-                    props.update && props.update(values);
-                }}
-            />
-        </div>
-    );
-}
-
-class NodeModel extends HtmlNodeModel {
-    setAttributes() {
-        const name = this.properties.name as string;
-        this.width = 200 + name.length * 10;
-        this.height = 45;
-        this.text.editable = false;
-        this.menu = [];
-
-        this.anchorsOffset = [
-            [this.width / 2, 0],
-            [0, this.height / 2],
-            [-this.width / 2, 0],
-            [0, -this.height / 2],
-        ];
-    }
-
-
-}
-
-class NodeNode extends HtmlNode {
-    setHtml(rootEl: SVGForeignObjectElement) {
-        const {properties} = this.props.model as HtmlNodeModel<NodeProperties>;
-        const div = document.createElement('div');
-
-        const settingVisible = properties.settingVisible !== false;
-
-        ReactDOM.createRoot(div).render(
-            <NodeView
-                name={properties.name}
-                code={properties.code}
-                properties={properties}
-                settingVisible={settingVisible}
-                update={async (values) => {
-                    this.props.model.setProperties(values);
-                }}/>,
-        );
-        //需要清空
-        rootEl.innerHTML = '';
-        rootEl.appendChild(div);
-        super.setHtml(rootEl);
-    }
-}
-
-export default {
-    type: 'node-node',
-    view: NodeNode,
-    model: NodeModel,
-};
-
diff --git a/admin-pro-ui/src/components/flow/nodes/Over/index.tsx b/admin-pro-ui/src/components/flow/nodes/Over/index.tsx
deleted file mode 100644
index 0ba1f1f6..00000000
--- a/admin-pro-ui/src/components/flow/nodes/Over/index.tsx
+++ /dev/null
@@ -1,142 +0,0 @@
-import {HtmlNode, HtmlNodeModel} from '@logicflow/core';
-import React from "react";
-import ReactDOM from "react-dom/client";
-import {CheckCircleFilled, SettingFilled} from "@ant-design/icons";
-import OverSettingPanel from "@/components/flow/nodes/panel/over";
-import StateTag from "@/components/flow/nodes/panel/StateTag";
-import {NodeState} from "@/components/flow/types";
-
-type OverProperties = {
-    id:string;
-    name: string;
-    code: string;
-    type:string;
-    view: string;
-    operatorMatcher:string;
-    editable:boolean;
-    titleGenerator:string;
-    errTrigger:string;
-    approvalType:string;
-    timeout:number;
-    settingVisible?: boolean;
-    state?: NodeState;
-}
-
-interface OverProps {
-    name: string;
-    code?: string;
-    update?: (values: any) => void;
-    settingVisible?: boolean;
-    properties?: OverProperties;
-}
-
-export const OverView: React.FC<OverProps> = (props) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const state = props.properties?.state;
-
-    return (
-        <div className="flow-node over-node">
-            <CheckCircleFilled
-                className={"icon"}
-            />
-            <div>
-                <span className={"code"}>
-                    {props.code && (
-                        <>({props.code})</>
-                    )}
-                </span>
-                <span className={"title"}>{props.name}</span>
-            </div>
-            {props.settingVisible && (
-                <SettingFilled
-                    className={"setting"}
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-
-            {state && (
-                <div className={"state"}>
-                    <StateTag
-                        state={state}/>
-                </div>
-            )}
-
-            <OverSettingPanel
-                visible={visible}
-                setVisible={setVisible}
-                properties={props.properties}
-                onSettingChange={(values) => {
-                    props.update && props.update(values);
-                }}
-            />
-        </div>
-    );
-}
-
-class OverModel extends HtmlNodeModel {
-
-    setAttributes() {
-        const name = this.properties.name as string;
-        this.width = 200 + name.length * 10;
-        this.height = 45;
-        this.text.editable = false;
-        this.menu = [];
-
-        this.sourceRules = [
-            {
-                message: `不允许输出`,
-                validate: (sourceNode, targetNode: any, sourceAnchor, targetAnchor) => {
-                    const edges = this.graphModel.getNodeIncomingEdge(targetNode.id);
-                    if (edges.length >= 0) {
-                        return false;
-                    } else {
-                        return true;
-                    }
-                },
-            },
-        ];
-
-        this.anchorsOffset = [
-            // [this.width / 2, 0],
-            // [0, this.height / 2],
-            // [-this.width / 2, 0],
-            [0, -this.height / 2],
-        ];
-    }
-
-
-}
-
-class OverNode extends HtmlNode {
-    setHtml(rootEl: SVGForeignObjectElement) {
-        const {properties} = this.props.model as HtmlNodeModel<OverProperties>;
-        const div = document.createElement('div');
-
-        const settingVisible = properties.settingVisible !== false;
-
-        ReactDOM.createRoot(div).render(
-            <OverView
-                name={properties.name}
-                code={properties.code}
-                properties={properties}
-                settingVisible={settingVisible}
-                update={async (values) => {
-                    this.props.model.setProperties(values);
-                }}/>,
-        );
-        //需要清空
-        rootEl.innerHTML = '';
-        rootEl.appendChild(div);
-        super.setHtml(rootEl);
-    }
-}
-
-export default {
-    type: 'over-node',
-    view: OverNode,
-    model: OverModel,
-};
-
diff --git a/admin-pro-ui/src/components/flow/nodes/Start/index.tsx b/admin-pro-ui/src/components/flow/nodes/Start/index.tsx
deleted file mode 100644
index d61aa615..00000000
--- a/admin-pro-ui/src/components/flow/nodes/Start/index.tsx
+++ /dev/null
@@ -1,126 +0,0 @@
-import {HtmlNode, HtmlNodeModel} from '@logicflow/core';
-import React from "react";
-import ReactDOM from "react-dom/client";
-import {PlayCircleFilled, SettingFilled} from "@ant-design/icons";
-import StartSettingPanel from "@/components/flow/nodes/panel/start";
-import StateTag from "@/components/flow/nodes/panel/StateTag";
-import {NodeState} from "@/components/flow/types";
-
-type StartProperties ={
-    id:string;
-    name: string;
-    code: string;
-    type:string;
-    view: string;
-    operatorMatcher:string;
-    editable:boolean;
-    titleGenerator:string;
-    errTrigger:string;
-    approvalType:string;
-    timeout:number;
-    settingVisible?: boolean;
-    state?: NodeState;
-}
-
-interface StartProps {
-    name: string;
-    code?: string;
-    settingVisible?: boolean;
-    update?: (values: any) => void;
-    properties?: StartProperties;
-}
-
-export const StartView: React.FC<StartProps> = (props) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const state = props.properties?.state;
-
-    return (
-        <div className="flow-node start-node">
-            <PlayCircleFilled
-                className={"icon"}
-            />
-            <div>
-                <span className={"code"}>
-                    {props.code && (
-                        <>({props.code})</>
-                    )}
-                </span>
-                <span className={"title"}>{props.name}</span>
-            </div>
-            {props.settingVisible && (
-                <SettingFilled
-                    className={"setting"}
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-
-            {state && (
-                <div className={"state"}>
-                    <StateTag
-                        state={state}/>
-                </div>
-            )}
-
-            <StartSettingPanel
-                visible={visible}
-                setVisible={setVisible}
-                properties={props.properties}
-                onSettingChange={(values) => {
-                    props.update && props.update(values);
-                }}
-            />
-        </div>
-    );
-}
-
-class StartModel extends HtmlNodeModel {
-    setAttributes() {
-        const name = this.properties.name as string;
-        this.width = 200 + name.length * 10;
-        this.height = 45;
-        this.text.editable = false;
-        this.menu = [];
-
-        this.anchorsOffset = [
-            // [this.width / 2, 0],
-            [0, this.height / 2],
-            // [-this.width / 2, 0],
-            // [0, -this.height / 2],
-        ];
-    }
-}
-
-
-class StartNode extends HtmlNode {
-
-    setHtml(rootEl: SVGForeignObjectElement) {
-        const {properties} = this.props.model as HtmlNodeModel<StartProperties>;
-        const div = document.createElement('div');
-        const settingVisible = properties.settingVisible !== false;
-
-        ReactDOM.createRoot(div).render(
-              <StartView
-                  name={properties.name}
-                  code={properties.code}
-                  properties={properties}
-                  settingVisible={settingVisible}
-                  update={async (values) => {
-                      this.props.model.setProperties(values);
-                  }}/>
-        );
-        //需要清空
-        rootEl.innerHTML = '';
-        rootEl.appendChild(div);
-        super.setHtml(rootEl);
-    }
-}
-
-export default {
-    type: 'start-node',
-    view: StartNode,
-    model: StartModel,
-};
-
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx b/admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx
deleted file mode 100644
index c8affa8f..00000000
--- a/admin-pro-ui/src/components/flow/nodes/panel/ButtonPanel.tsx
+++ /dev/null
@@ -1,230 +0,0 @@
-import React from "react";
-import {ActionType, ProColumns, ProTable} from "@ant-design/pro-components";
-import {Button, ColorPicker, Modal, Popconfirm, Space} from "antd";
-import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
-import {EyeOutlined} from "@ant-design/icons";
-import FlowContext from "@/components/flow/domain/FlowContext";
-import {Form,FormInput,FormSelect,FormColor} from "@codingapi/form-pc";
-import {ValidateUtils} from "@codingapi/ui-framework";
-
-interface ButtonPanelProps {
-    id: string;
-}
-
-const ButtonPanel: React.FC<ButtonPanelProps> = (props) => {
-
-    const actionRef = React.useRef<ActionType>();
-
-    const form = Form.useForm();
-    const groovyForm = Form.useForm();
-
-    const [visible, setVisible] = React.useState(false);
-
-    const [scriptVisible, setScriptVisible] = React.useState(false);
-
-    const [type, setType] = React.useState<string>();
-
-    const flowContext = FlowContext.getInstance();
-
-    const columns = [
-        {
-            title: 'id',
-            dataIndex: 'id',
-            key: 'id',
-            hidden: true
-        },
-        {
-            title: '按钮名称',
-            dataIndex: 'name',
-            key: 'name',
-        },
-        {
-            title: '事件类型',
-            dataIndex: 'type',
-            key: 'type',
-            render: (value: string) => {
-                return flowContext.getFlowPanelContext()?.convertButtonValue(value);
-            }
-        },
-        {
-            title: '按钮颜色',
-            dataIndex: 'style',
-            key: 'style',
-            render: (_: any, record: any) => {
-                return <ColorPicker value={record.style?.background} disabled={true}/>;
-            }
-        },
-        {
-            title: '排序',
-            dataIndex: 'order',
-            key: 'order',
-        },
-        {
-            title: "操作",
-            valueType: "option",
-            render: (_: any, record: any) => {
-                return [
-                    <a
-                        key={"edit"}
-                        onClick={() => {
-                            groovyForm.reset();
-                            form.setFieldsValue(record);
-                            setType(record.type);
-                            setVisible(true);
-                        }}
-                    >
-                        修改
-                    </a>,
-                    <Popconfirm
-                        key={"delete"}
-                        title={"确认要删除吗？"}
-                        onConfirm={() => {
-                            flowContext.getFlowPanelContext()?.deleteButton(props.id, record.id);
-                            actionRef.current?.reload();
-                        }}>
-                        <a>删除</a>
-                    </Popconfirm>
-                ]
-            }
-        }
-    ] as ProColumns[];
-
-    return (
-        <>
-            <ProTable
-                columns={columns}
-                actionRef={actionRef}
-                key={"id"}
-                search={false}
-                options={false}
-                pagination={false}
-                request={async () => {
-                    const buttons = flowContext?.getFlowPanelContext()?.getButtons(props.id) || [];
-                    return {
-                        data: buttons,
-                        total: buttons.length,
-                    }
-                }}
-                toolBarRender={() => {
-                    return [
-                        <Button
-                            type={"primary"}
-                            onClick={() => {
-                                groovyForm.reset();
-                                setVisible(true);
-                            }}
-                        >添加按钮</Button>
-                    ]
-                }}
-            />
-
-            <Modal
-                title={"添加节点按钮"}
-                open={visible}
-                onCancel={()=>{
-                    setVisible(false);
-                }}
-                onClose={()=>{
-                    setVisible(false);
-                }}
-                onOk={async ()=>{
-                    await form.submit();
-                }}
-                destroyOnClose={true}
-            >
-
-                <Form
-                    layout={"vertical"}
-                    form={form}
-                    onFinish={async (values) => {
-                        flowContext.getFlowPanelContext()?.updateButton(props.id, values as any);
-                        setVisible(false);
-                        actionRef.current?.reload();
-                    }}
-                >
-
-                    <FormInput
-                        name={"id"}
-                        hidden={true}
-                    />
-
-                    <FormInput
-                        name={"name"}
-                        label={"按钮名称"}
-                        placeholder={"请输入按钮名称"}
-                        required={true}
-                        validateFunction={ValidateUtils.validateNotEmpty}
-                    />
-
-                    <FormColor
-                        name={["style","background"]}
-                        label={"按钮颜色"}
-                        placeholder={"请输入按钮颜色"}
-                    />
-
-                    <FormSelect
-                        name={"type"}
-                        label={(
-                            <Space>
-                                按钮类型
-
-                                {type === 'CUSTOM' && (
-                                    <EyeOutlined
-                                        onClick={() => {
-                                            groovyForm.reset();
-                                            const script = form.getFieldValue('groovy') || 'def run(content){\n  //你的代码 \n  return content.createMessageResult(\'我是自定义标题\');\n}';
-                                            groovyForm.setFieldsValue({
-                                                'script': script
-                                            });
-                                            setScriptVisible(!scriptVisible);
-                                        }}/>
-                                )}
-
-                            </Space>
-                        )}
-                        placeholder={"请输入按钮类型"}
-                        required={true}
-                        options={flowContext.getFlowPanelContext()?.getButtonEventOptions()}
-                        onChange={(value: string) => {
-                            setType(value);
-                        }}
-                    />
-
-                    {type === 'VIEW' && (
-                        <FormInput
-                            name={"eventKey"}
-                            label={"事件Key"}
-                            help={"事件Key用于流程Form的事件触发"}
-                            required={true}
-                        />
-                    )}
-
-                    <FormInput
-                        name={"groovy"}
-                        hidden={true}
-                    />
-
-                    <FormInput
-                        name={"order"}
-                        label={"排序"}
-                        inputType={"number"}
-                        placeholder={"请输入排序"}
-                    />
-
-                    <ScriptModal
-                        onFinish={(values) => {
-                            form.setFieldsValue({
-                                'groovy': values.script
-                            });
-                        }}
-                        form={groovyForm}
-                        setVisible={setScriptVisible}
-                        visible={scriptVisible}/>
-
-                </Form>
-            </Modal>
-        </>
-    )
-}
-
-export default ButtonPanel;
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx b/admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx
deleted file mode 100644
index 14b0cf1f..00000000
--- a/admin-pro-ui/src/components/flow/nodes/panel/EdgePanel.tsx
+++ /dev/null
@@ -1,195 +0,0 @@
-import React from "react";
-import {ActionType, ProTable} from "@ant-design/pro-components";
-import {Input, InputNumber, Popconfirm, Space} from "antd";
-import {CheckOutlined, EditOutlined, SettingOutlined} from "@ant-design/icons";
-import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
-import FlowContext from "@/components/flow/domain/FlowContext";
-import {Form} from "@codingapi/form-pc";
-
-interface EdgePanelProps {
-    id?: string;
-    type: string;
-}
-
-const EdgePanel: React.FC<EdgePanelProps> = (props) => {
-
-    const [visible, setVisible] = React.useState(false);
-
-    const [name, setName] = React.useState("");
-    const [order, setOrder] = React.useState(0);
-
-    const groovyForm = Form.useForm();
-    const actionRef = React.useRef<ActionType>();
-
-    const flowContext = FlowContext.getInstance();
-
-    const handlerChangeName = (id: any) => {
-        flowContext.getFlowPanelContext()?.changeEdgeName(id, name);
-        actionRef.current?.reload();
-    }
-
-    const handlerChangeOrder = (id: any) => {
-        flowContext.getFlowPanelContext()?.changeEdgeOrder(id, order);
-        actionRef.current?.reload();
-    }
-
-    const handlerChangeBack = (id: any, back: boolean) => {
-        flowContext.getFlowPanelContext()?.changeEdgeBack(id, back);
-        actionRef.current?.reload();
-    }
-
-    const handlerChangeOutTrigger = (id: any, outTrigger: string) => {
-        flowContext.getFlowPanelContext()?.changeEdgeOutTrigger(id, outTrigger);
-        actionRef.current?.reload();
-    }
-
-    const columns = [
-        {
-            title: 'id',
-            dataIndex: 'id',
-            key: 'id',
-            hidden: true
-        },
-        {
-            title: '关系名称',
-            dataIndex: 'name',
-            key: 'name',
-            render: (text: string, record: any) => {
-                return (
-                    <Space>
-                        {record.name ? record.name : "未命名"}
-
-                        <Popconfirm
-                            title={"修改名称"}
-                            description={(
-                                <Input
-                                    defaultValue={record.name}
-                                    onChange={(e) => {
-                                        setName(e.target.value);
-                                    }}/>
-                            )}
-                            onConfirm={() => {
-                                handlerChangeName(record.id);
-                            }}
-                        >
-                            <EditOutlined/>
-                        </Popconfirm>
-                    </Space>
-                )
-            }
-        },
-        {
-            title: '关系类型',
-            dataIndex: 'type',
-            key: 'relation',
-            render: (text: string, record: any) => {
-                return (
-                    <>{record.source.name} {"->"} {record.target.name}</>
-                )
-            }
-        },
-        {
-            title: '出口设置',
-            dataIndex: 'outTrigger',
-            key: 'outTrigger',
-            render: (text: string, record: any) => {
-                return (
-                    <Space>
-                        <SettingOutlined
-                            onClick={() => {
-                                groovyForm.setFieldValue("script", record.outTrigger);
-                                groovyForm.setFieldValue("type", record.id);
-                                setVisible(true);
-                            }}/>
-                        {record.outTrigger ? (<CheckOutlined/>) : null}
-                    </Space>
-                )
-            }
-        },
-        {
-            title: '是否退回',
-            dataIndex: 'back',
-            hidden: props.type === 'start',
-            key: 'back',
-            render: (text: string, record: any) => {
-                return (
-
-                    <Space>
-                        <Popconfirm
-                            title={`确认修改为${text ? '否' : '是'}吗？`}
-                            onConfirm={() => {
-                                handlerChangeBack(record.id, !text);
-                            }}
-                        >
-                            <SettingOutlined/>
-                        </Popconfirm>
-
-                        {text ? '是' : '否'}
-                    </Space>
-
-
-                )
-            }
-        },
-        {
-            title: '排序',
-            dataIndex: 'order',
-            key: 'order',
-            render: (text: string, record: any) => {
-                return (
-                    <Space>
-                        <Popconfirm
-                            title={"修改排序"}
-                            description={(
-                                <InputNumber
-                                    defaultValue={record.order}
-                                    step={1}
-                                    onChange={(e) => {
-                                        setOrder(e);
-                                    }}/>)}
-                            onConfirm={() => {
-                                handlerChangeOrder(record.id);
-                            }}
-                        >
-                            <SettingOutlined/>
-                        </Popconfirm>
-
-                        {text}
-                    </Space>
-                )
-            }
-        },
-    ] as any[];
-
-
-    return (
-        <>
-            <ProTable
-                columns={columns}
-                actionRef={actionRef}
-                key={"id"}
-                search={false}
-                options={false}
-                pagination={false}
-                request={async () => {
-                    const data = props.id ? flowContext.getFlowPanelContext()?.getEdges(props.id) as any[] : [];
-                    return {
-                        data: data.sort((a: any, b: any) => {
-                            return a.order - b.order;
-                        }),
-                        success: true
-                    }
-                }}
-            />
-
-            <ScriptModal
-                onFinish={(values) => {
-                    handlerChangeOutTrigger(values.type, values.script);
-                }}
-                form={groovyForm}
-                setVisible={setVisible}
-                visible={visible}/>
-        </>
-    )
-}
-export default EdgePanel;
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx b/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx
deleted file mode 100644
index 57e7f80c..00000000
--- a/admin-pro-ui/src/components/flow/nodes/panel/NodePanel.tsx
+++ /dev/null
@@ -1,279 +0,0 @@
-import React from "react";
-import {Button, Divider, Space} from "antd";
-import {EyeOutlined, SettingOutlined} from "@ant-design/icons";
-import GroovyScript from "@/components/flow/utils/script";
-import ScriptModal from "@/components/flow/nodes/panel/ScriptModal";
-import {ValidateUtils,ComponentBus,FormInstance} from "@codingapi/ui-framework";
-import {FormSelect,FormSwitch,FormInput,Form} from "@codingapi/form-pc";
-import {UserSelectFormProps, UserSelectFormViewKey} from "@/components/flow/types";
-
-interface NodePanelProps {
-    id?: string,
-    data?: any,
-    onFinish: (values: any) => void,
-    form: FormInstance,
-    type: string,
-}
-
-const NodePanel: React.FC<NodePanelProps> = (props) => {
-
-    const groovyForm = Form.useForm();
-
-    const [visible, setVisible] = React.useState(false);
-
-    const [userSelectVisible, setUserSelectVisible] = React.useState(false);
-
-    const [operatorMatcherType, setOperatorMatcherType] = React.useState(props.data?.operatorMatcherType);
-
-    // 用户选人视图
-    const UserSelectView = ComponentBus.getInstance().getComponent<UserSelectFormProps>(UserSelectFormViewKey);
-
-    return (
-        <>
-            <Form
-                form={props.form}
-                initialValues={{
-                    ...props.data,
-                    operatorMatcherType: GroovyScript.operatorMatcherType(props.data?.operatorMatcher),
-                    errTriggerType: GroovyScript.errTriggerType(props.data?.errTrigger),
-                    titleGeneratorType: GroovyScript.titleGeneratorType(props.data?.titleGenerator),
-                }}
-                layout={"vertical"}
-                onFinish={async (values)=>{
-                    props.onFinish(values);
-                }}
-            >
-                <Divider>
-                    基本信息
-                </Divider>
-                <FormInput
-                    name={"name"}
-                    label={"节点名称"}
-                    required={true}
-                    validateFunction={ValidateUtils.validateNotEmpty}
-                />
-                <FormInput
-                    name={"code"}
-                    disabled={props.type === 'start' || props.type === 'over'}
-                    label={"节点编码"}
-                    required={true}
-                    validateFunction={ValidateUtils.validateNotEmpty}
-                />
-                <FormInput
-                    name={"view"}
-                    label={"视图名称"}
-                    tooltip={"界面渲染视图的名称"}
-                    required={true}
-                    validateFunction={ValidateUtils.validateNotEmpty}
-                />
-
-                <Divider>
-                    节点配置
-                </Divider>
-
-                <FormSelect
-                    name={"approvalType"}
-                    label={"节点类型"}
-                    hidden={props.type !== 'node'}
-                    tooltip={"会签即多人审批以后再处理，非会签则是一个人处理以后即可响应"}
-                    required={true}
-                    validateFunction={ValidateUtils.validateNotEmpty}
-                    options={[
-                        {
-                            label: "会签",
-                            value: "SIGN"
-                        },
-                        {
-                            label: "非会签",
-                            value: "UN_SIGN"
-                        },
-                    ]}
-                />
-
-                <FormInput
-                    tooltip={"操作人匹配脚本"}
-                    name={"operatorMatcher"}
-                    label={"操作人"}
-                    hidden={true}
-                />
-
-                <FormSelect
-                    tooltip={"操作人匹配脚本"}
-                    name={"operatorMatcherType"}
-                    label={"操作人"}
-                    options={[
-                        {
-                            label: "任意人",
-                            value: "any"
-                        },
-                        {
-                            label: "发起人",
-                            value: "creator"
-                        },
-                        {
-                            label: "自定义",
-                            value: "custom"
-                        },
-                    ]}
-                    onChange={(value) => {
-                        setOperatorMatcherType(value as string);
-                        props.form.setFieldsValue({
-                            operatorMatcher: GroovyScript.operatorMatcher(value as string)
-                        })
-                    }}
-                    addonAfter={(
-                        <Space>
-                            {operatorMatcherType==='custom' && (
-                                <Button
-                                    icon={<SettingOutlined/>}
-                                    onClick={() => {
-                                        setUserSelectVisible(true);
-                                    }}
-                                >
-                                    选择人员
-                                </Button>
-                            )}
-
-                            <EyeOutlined
-                                onClick={() => {
-                                    const value = props.form.getFieldValue("operatorMatcher");
-                                    groovyForm.setFieldValue("type", "operatorMatcher");
-                                    groovyForm.setFieldValue("script", value);
-                                    setVisible(true);
-                                }}/>
-
-                        </Space>
-                    )}
-                />
-
-                <FormInput
-                    inputType={"number"}
-                    tooltip={"超时提醒时间，单位毫米。为0时则为无超时设置"}
-                    name={"timeout"}
-                    hidden={props.type === 'circulate'}
-                    label={"超时时间"}
-                />
-
-                <FormSwitch
-                    tooltip={"关闭编辑以后在当前节点下的流程表单无法修改数据"}
-                    name={"editable"}
-                    label={"是否编辑"}
-                />
-
-                <FormInput
-                    name={"titleGenerator"}
-                    label={"自定义标题"}
-                    hidden={true}
-                />
-
-                <FormSelect
-                    tooltip={"待办记录中的标题生成器脚本"}
-                    name={"titleGeneratorType"}
-                    label={"自定义标题"}
-                    options={[
-                        {
-                            label: "默认",
-                            value: "default"
-                        },
-                        {
-                            label: "自定义",
-                            value: "custom"
-                        },
-                    ]}
-                    onChange={(value) => {
-                        if (value === "default") {
-                            props.form.setFieldsValue({
-                                titleGenerator: GroovyScript.defaultTitleGenerator
-                            })
-                        }
-                    }}
-                    addonAfter={(
-                        <EyeOutlined
-                            onClick={() => {
-                                const value = props.form.getFieldValue("titleGenerator");
-                                groovyForm.setFieldValue("type", "titleGenerator");
-                                groovyForm.setFieldValue("script", value);
-                                setVisible(true);
-                            }}/>
-                    )}
-                />
-
-                <Divider>
-                    异常配置
-                </Divider>
-
-                <FormInput
-                    name={"errTrigger"}
-                    label={"异常配置"}
-                    hidden={true}
-                />
-
-                <FormSelect
-                    tooltip={"当节点无人员匹配时的异常补偿脚本，可以指定人员或节点处理"}
-                    name={"errTriggerType"}
-                    label={"异常配置"}
-                    options={[
-                        {
-                            label: "默认",
-                            value: "default"
-                        },
-                        {
-                            label: "自定义",
-                            value: "custom"
-                        },
-                    ]}
-                    onChange={(value) => {
-                        if (value === "default") {
-                            props.form.setFieldsValue({
-                                errTrigger: GroovyScript.defaultOutTrigger
-                            })
-                        }
-                    }}
-                    addonAfter={(
-                        <EyeOutlined
-                            onClick={() => {
-                                const value = props.form.getFieldValue("errTrigger");
-                                groovyForm.setFieldValue("type", "errTrigger");
-                                groovyForm.setFieldValue("script", value);
-                                setVisible(true);
-                            }}/>
-                    )}
-                />
-
-            </Form>
-
-            <ScriptModal
-                onFinish={(values) => {
-                    const type = values.type;
-                    props.form.setFieldsValue({
-                        [type]: values.script
-                    });
-                }}
-                form={groovyForm}
-                setVisible={setVisible}
-                visible={visible}/>
-
-            {UserSelectView && (
-                <UserSelectView
-                    visible={userSelectVisible}
-                    setVisible={setUserSelectVisible}
-                    userSelectType={"users"}
-                    specifyUserIds={GroovyScript.getOperatorUsers(props.form.getFieldValue("operatorMatcher"))}
-                    multiple={true}
-                    onFinish={(values) => {
-                        setUserSelectVisible(false);
-                        const script = GroovyScript.specifyOperatorMatcher.replaceAll("%s", values.map((item: any) => item.id).join(","));
-                        props.form.setFieldsValue({
-                            operatorMatcher: script
-                        });
-                    }}
-                />
-            )}
-
-        </>
-    )
-}
-
-export default NodePanel;
-
-
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.scss b/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.scss
deleted file mode 100644
index e5ca41f5..00000000
--- a/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.scss
+++ /dev/null
@@ -1,33 +0,0 @@
-.flow-script-modal {
-  height: 70vh !important;
-  width: 80vw !important;
-
-  .flow-script-content {
-    display: flex;
-    height: 100%;
-
-    .flow-script-help {
-      flex: 1;
-
-      .flow-script-help-markdown {
-        height: 65vh;
-        overflow: auto;
-        *{
-            white-space: pre-wrap;
-        }
-
-        pre{
-          background-color: #1e2022;
-          code{
-            padding: 2px;
-            border-radius: 2px;
-            color: #8df823;
-          }
-        }
-      }
-    }
-    .flow-script-form {
-      flex: 2;
-    }
-  }
-}
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.tsx b/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.tsx
deleted file mode 100644
index ae68961e..00000000
--- a/admin-pro-ui/src/components/flow/nodes/panel/ScriptModal.tsx
+++ /dev/null
@@ -1,71 +0,0 @@
-import React from "react";
-import Markdown from "react-markdown";
-import {markdown} from "@/components/flow/nodes/panel/help";
-import remarkGfm from 'remark-gfm'
-import "./ScriptModal.scss";
-import {FormInstance} from "@codingapi/ui-framework";
-import {Modal} from "antd";
-import {Form,FormInput,FormCode} from "@codingapi/form-pc";
-
-interface ScriptModalProps {
-    form: FormInstance;
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    onFinish: (values: any) => void;
-}
-
-const ScriptModal: React.FC<ScriptModalProps> = (props) => {
-    return (
-        <Modal
-            width={"85vw"}
-            className={"flow-script-modal"}
-            title={"脚本预览"}
-            open={props.visible}
-            onCancel={() => {
-                props.setVisible(false);
-            }}
-            onClose={() => {
-                props.setVisible(false);
-            }}
-            onOk={async ()=>{
-                await props.form.submit();
-            }}
-            destroyOnClose={true}
-        >
-            <Form
-                form={props.form}
-                onFinish={async (values) => {
-                    props.onFinish(values);
-                    props.setVisible(false);
-                }}
-            >
-                <div className={"flow-script-content"}>
-                    <div className={"flow-script-help"}>
-                        <div className={"flow-script-help-markdown"}>
-                            <Markdown
-                                remarkPlugins={[remarkGfm]}
-                            >
-                                {markdown}
-                            </Markdown>
-                        </div>
-                    </div>
-                    <div className={"flow-script-form"}>
-                        <FormInput
-                            name={"type"}
-                            hidden={true}
-                        />
-
-                        <FormCode
-                            name={"script"}
-                            codeStyle={{
-                                height: '65vh',
-                            }}
-                        />
-                    </div>
-                </div>
-            </Form>
-        </Modal>
-    )
-}
-
-export default ScriptModal;
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/StateTag.tsx b/admin-pro-ui/src/components/flow/nodes/panel/StateTag.tsx
deleted file mode 100644
index 7b9ec615..00000000
--- a/admin-pro-ui/src/components/flow/nodes/panel/StateTag.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import React from "react";
-import {Tag} from "antd";
-import {NodeState} from "@/components/flow/types";
-
-interface StateLabelProps {
-    state:NodeState;
-}
-
-const StateTag:React.FC<StateLabelProps> = (props)=>{
-
-    const color = (state:NodeState) => {
-        switch (state) {
-            case "done":
-                return "success";
-            case "undone":
-                return "processing";
-            case "current":
-                return "warning";
-            default:
-                return "default";
-        }
-    }
-
-    const label = (state:NodeState) => {
-        switch (state) {
-            case "done":
-                return "已执行";
-            case "undone":
-                return "未执行";
-            case "current":
-                return "当前节点";
-            default:
-                return "待执行";
-        }
-    }
-
-    return (
-        <Tag
-            color={color(props.state)}
-        >
-            {label(props.state)}
-        </Tag>
-    )
-}
-
-export default StateTag
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/circulate.tsx b/admin-pro-ui/src/components/flow/nodes/panel/circulate.tsx
deleted file mode 100644
index 8c3dedff..00000000
--- a/admin-pro-ui/src/components/flow/nodes/panel/circulate.tsx
+++ /dev/null
@@ -1,71 +0,0 @@
-import React from "react";
-import {Button, Drawer, Space, Tabs} from "antd";
-import NodePanel from "@/components/flow/nodes/panel/NodePanel";
-import EdgePanel from "@/components/flow/nodes/panel/EdgePanel";
-import {SettingPanelProps} from "@/components/flow/types";
-import {Form} from "@codingapi/form-pc";
-
-const CirculateSettingPanel: React.FC<SettingPanelProps> = (props) => {
-
-    const form = Form.useForm();
-
-    return (
-        <Drawer
-            title={"节点设置"}
-            width={"40%"}
-            destroyOnClose={true}
-            onClose={() => {
-                props.setVisible(false);
-            }}
-            open={props.visible}
-            extra={(
-                <Space>
-                    <Button
-                        type={"primary"}
-                        onClick={async () => {
-                            await form.submit();
-                            props.setVisible(false);
-                        }}
-                    >确认</Button>
-
-                    <Button
-                        onClick={() => {
-                            props.setVisible(false);
-                        }}
-                    >关闭</Button>
-                </Space>
-            )}
-        >
-            <Tabs
-                items={[
-                    {
-                        label: "节点设置",
-                        key: "nodes",
-                        children: (
-                            <NodePanel
-                                type={"circulate"}
-                                form={form}
-                                id={props.properties?.id}
-                                data={props.properties}
-                                onFinish={props.onSettingChange}
-                            />
-                        )
-                    },
-                    {
-                        label: "关系设置",
-                        key: "edges",
-                        children: (
-                            <EdgePanel
-                                type={"node"}
-                                id={props.properties?.id}/>
-                        )
-                    }
-                ]}
-            />
-
-        </Drawer>
-    )
-
-}
-
-export default CirculateSettingPanel;
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/help.ts b/admin-pro-ui/src/components/flow/nodes/panel/help.ts
deleted file mode 100644
index 55786605..00000000
--- a/admin-pro-ui/src/components/flow/nodes/panel/help.ts
+++ /dev/null
@@ -1,95 +0,0 @@
-export const markdown = `
-# 脚本说明
-### 函数的定义必须为
-
-    def run(content){
-        // 你的代码
-        return true;
-    }
-
-### 在设置操作人是函数返回的人员的id数组
-
-
-    def run(content){
-        // 你的代码
-        return [1,2,3];
-    }
-    
-
-### 在设置异常配置是函数返回的是人员或节点：
-
-    def run(content){
-        // 你的代码
-        // return content.createNodeErrTrigger("code");
-        // return content.createOperatorErrTrigger(1,2,3);
-    }
-
-
-### 在自定义标题时，返回的字符串：
-
-    def run(content){
-        // 你的代码
-        return content.getCreateOperator().getName() + '-' + content.getFlowWork().getTitle() + '-' + content.getFlowNode().getName();
-    }
-
-### 在自定义按钮事件时，返回createMessageResult函数：
-
-    def run(content){
-        // 你的代码
-        // 自定义返回标题
-        // return content.createMessageResult('我是自定义标题');
-        // 自定义返回标题并且关闭流程
-        // return content.createMessageResult('我是自定义标题', true);
-        // 自定义返回标题并添加现实内容
-        return content.createMessageResult('我是自定义标题', true).addItem('我是标题1','我是内容2').addItem('我是标题2','我是内容2');
-    }
-
-
-### 在自定义按钮事件时，操作流程：
-
-    def run(content){
-        // 你的代码
-        // 自定义返回标题
-        // return content.createMessageResult('我是自定义标题');
-        // 自定义返回标题，并且设置返回状态 SUCCESS、INFO、WARNING 三种状态
-        // return content.createMessageResult('我是自定义标题').resultState('SUCCESS');
-        // 自定义返回标题并且关闭流程
-        // return content.createMessageResult('我是自定义标题', true);
-        // 提交流程
-        // content.submitFlow();
-        // 驳回流程
-        // content.rejectFlow();
-        // 催办流程
-        // content.urgeFlow();
-        // 保存流程
-        // content.saveFlow();
-        // 撤回流程
-        // content.recallFlow();
-        // 预提交流程
-        // content.trySubmitFlow();
-        // 自定义返回标题并添加现实内容
-        return content.createMessageResult('我是自定义标题', true).addMessage('我是标题1','我是内容2').addMessage('我是标题2','我是内容2').closeable(false);
-    }
-
-### content对象字段说明
-
-content对象能力，content对象下存在了flowWork  
-
-流程设计对象访问方式为content.getFlowWork()
-  
-flowNode 流程节点对象访问方式为content.getFlowNode()
-
-createOperator 创建人对象访问方式为content.getCreateOperator()
-
-currentOperator 当前操作人对象访问方式为content.getCurrentOperator()
-
-获取当前表单数据对象 content.getBindData()
-
-获取当前审批意见对象 content.getOpinion()
-
-获取当前节点的审批历史记录数据 content.getHistoryRecords()
-
-获取spring的bean对象 content.getBean("beanName")
- 
-
-`
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/node.tsx b/admin-pro-ui/src/components/flow/nodes/panel/node.tsx
deleted file mode 100644
index 9a77173a..00000000
--- a/admin-pro-ui/src/components/flow/nodes/panel/node.tsx
+++ /dev/null
@@ -1,81 +0,0 @@
-import React from "react";
-import {Button, Drawer, Space, Tabs} from "antd";
-import NodePanel from "@/components/flow/nodes/panel/NodePanel";
-import EdgePanel from "@/components/flow/nodes/panel/EdgePanel";
-import ButtonPanel from "@/components/flow/nodes/panel/ButtonPanel";
-import {SettingPanelProps} from "@/components/flow/types";
-import {Form} from "@codingapi/form-pc";
-
-
-const NodeSettingPanel: React.FC<SettingPanelProps> = (props) => {
-
-    const form = Form.useForm();
-
-    return (
-        <Drawer
-            title={"节点设置"}
-            width={"40%"}
-            destroyOnClose={true}
-            onClose={() => {
-                props.setVisible(false);
-            }}
-            open={props.visible}
-            extra={(
-                <Space>
-                    <Button
-                        type={"primary"}
-                        onClick={async () => {
-                            await form.submit();
-                            props.setVisible(false);
-                        }}
-                    >确认</Button>
-
-                    <Button
-                        onClick={() => {
-                            props.setVisible(false);
-                        }}
-                    >关闭</Button>
-                </Space>
-            )}
-        >
-            <Tabs
-                items={[
-                    {
-                        label: "节点设置",
-                        key: "nodes",
-                        children: (
-                            <NodePanel
-                                type={"node"}
-                                form={form}
-                                id={props.properties?.id}
-                                data={props.properties}
-                                onFinish={props.onSettingChange}
-                            />
-                        )
-                    },
-                    {
-                        label: "节点按钮",
-                        key: "buttons",
-                        children: (
-                            <ButtonPanel
-                                id={props.properties?.id}/>
-                        )
-                    },
-                    {
-                        label: "关系设置",
-                        key: "edges",
-                        children: (
-                            <EdgePanel
-                                type={"node"}
-                                id={props.properties?.id}/>
-                        )
-                    },
-                ]}
-            />
-
-        </Drawer>
-    )
-
-}
-
-export default NodeSettingPanel;
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/over.tsx b/admin-pro-ui/src/components/flow/nodes/panel/over.tsx
deleted file mode 100644
index 2e3f2969..00000000
--- a/admin-pro-ui/src/components/flow/nodes/panel/over.tsx
+++ /dev/null
@@ -1,51 +0,0 @@
-import React from "react";
-import {Button, Drawer, Space} from "antd";
-import NodePanel from "@/components/flow/nodes/panel/NodePanel";
-import {SettingPanelProps} from "@/components/flow/types";
-import {Form} from "@codingapi/form-pc";
-
-const OverSettingPanel: React.FC<SettingPanelProps> = (props) => {
-
-    const form = Form.useForm();
-
-    return (
-        <Drawer
-            title={"节点设置"}
-            width={"40%"}
-            destroyOnClose={true}
-            onClose={() => {
-                props.setVisible(false);
-            }}
-            open={props.visible}
-            extra={(
-                <Space>
-                    <Button
-                        type={"primary"}
-                        onClick={async () => {
-                            await form.submit();
-                            props.setVisible(false);
-                        }}
-                    >确认</Button>
-
-                    <Button
-                        onClick={() => {
-                            props.setVisible(false);
-                        }}
-                    >关闭</Button>
-                </Space>
-            )}
-        >
-            <NodePanel
-                form={form}
-                type={"over"}
-                id={props.properties?.id}
-                data={props.properties}
-                onFinish={props.onSettingChange}
-            />
-
-        </Drawer>
-    )
-
-}
-
-export default OverSettingPanel;
diff --git a/admin-pro-ui/src/components/flow/nodes/panel/start.tsx b/admin-pro-ui/src/components/flow/nodes/panel/start.tsx
deleted file mode 100644
index b2adec36..00000000
--- a/admin-pro-ui/src/components/flow/nodes/panel/start.tsx
+++ /dev/null
@@ -1,81 +0,0 @@
-import React from "react";
-import {Button, Drawer, Space, Tabs} from "antd";
-import EdgePanel from "@/components/flow/nodes/panel/EdgePanel";
-import NodePanel from "@/components/flow/nodes/panel/NodePanel";
-import ButtonPanel from "@/components/flow/nodes/panel/ButtonPanel";
-import {SettingPanelProps} from "@/components/flow/types";
-import {Form} from "@codingapi/form-pc";
-
-const StartSettingPanel: React.FC<SettingPanelProps> = (props) => {
-
-    const form = Form.useForm();
-
-    return (
-        <Drawer
-            title={"节点设置"}
-            width={"40%"}
-            onClose={() => {
-                props.setVisible(false);
-            }}
-            open={props.visible}
-            destroyOnClose={true}
-            extra={(
-                <Space>
-                    <Button
-                        type={"primary"}
-                        onClick={async () => {
-                            await form.submit();
-                            props.setVisible(false);
-                        }}
-                    >确认</Button>
-
-                    <Button
-                        onClick={() => {
-                            props.setVisible(false);
-                        }}
-                    >关闭</Button>
-                </Space>
-            )}
-
-        >
-            <Tabs
-                items={[
-                    {
-                        label: "节点设置",
-                        key: "nodes",
-                        children: (
-                            <NodePanel
-                                type={"start"}
-                                form={form}
-                                id={props.properties?.id}
-                                data={props.properties}
-                                onFinish={props.onSettingChange}
-                            />
-                        )
-                    },
-                    {
-                        label: "节点按钮",
-                        key: "buttons",
-                        children: (
-                            <ButtonPanel
-                                id={props.properties?.id}/>
-                        )
-                    },
-                    {
-                        label: "关系设置",
-                        key: "edges",
-                        children: (
-                            <EdgePanel
-                                type={"start"}
-                                id={props.properties?.id}/>
-                        )
-                    }
-                ]}
-            />
-
-        </Drawer>
-    )
-
-}
-
-export default StartSettingPanel;
diff --git a/admin-pro-ui/src/components/flow/panel/ControlPanel.scss b/admin-pro-ui/src/components/flow/panel/ControlPanel.scss
deleted file mode 100644
index f71c3b4c..00000000
--- a/admin-pro-ui/src/components/flow/panel/ControlPanel.scss
+++ /dev/null
@@ -1,35 +0,0 @@
-@use "../index" as *;
-
-.flow-panel-control {
-  margin-top: 10px;
-  background-color: $flow-background-color;
-  box-shadow: 0 0 10px 1px $flow-box-shadow-color;
-  position: absolute;
-  right: 70px;
-  z-index: 101;
-
-  .flow-panel-control-content{
-    width: 30px;
-    border-radius: 12px;
-    background-color: $flow-background-color;
-    display: flex;
-    flex-direction: column;
-    justify-content: space-around;
-    align-items: center;
-    position: absolute;
-    left: 10px;
-    padding: 4px 0;
-    box-shadow: 3px 0 2px 1px $flow-box-shadow-color;
-
-    .flow-panel-control-content-item{
-      margin-top: 10px;
-      margin-bottom: 10px;
-    }
-  }
-}
-
-
-.lf-mini-map {
-  border: none !important;
-  box-shadow: 3px 0 10px 1px $flow-box-shadow-color;
-}
diff --git a/admin-pro-ui/src/components/flow/panel/ControlPanel.tsx b/admin-pro-ui/src/components/flow/panel/ControlPanel.tsx
deleted file mode 100644
index 8395544a..00000000
--- a/admin-pro-ui/src/components/flow/panel/ControlPanel.tsx
+++ /dev/null
@@ -1,95 +0,0 @@
-import React, {useEffect} from "react";
-import {
-    ArrowDownOutlined,
-    ArrowLeftOutlined,
-    ArrowRightOutlined,
-    EnvironmentOutlined,
-    MonitorOutlined,
-    ZoomInOutlined,
-    ZoomOutOutlined
-} from "@ant-design/icons";
-import {Tooltip} from "antd";
-import "./ControlPanel.scss";
-import FlowContext from "@/components/flow/domain/FlowContext";
-
-const ControlPanel = () => {
-    const iconSize = 16;
-
-    const flowContext = FlowContext.getInstance();
-
-    const [mapVisible, setMapVisible] = React.useState(false);
-
-    useEffect(() => {
-        if (mapVisible) {
-            flowContext.getFlowPanelContext()?.showMap();
-        } else {
-            flowContext.getFlowPanelContext()?.hiddenMap();
-        }
-    }, [mapVisible]);
-
-    return (
-        <div className={"flow-panel-control"}>
-            <div className={"flow-panel-control-content"}>
-                <Tooltip className={"flow-panel-control-content-item"} placement="top" title={"放大"}>
-                    <ZoomInOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            flowContext?.getFlowPanelContext()?.zoom(true);
-                        }}
-                    />
-                </Tooltip>
-                <Tooltip className={"flow-panel-control-content-item"} placement="top" title={"缩小"}>
-                    <ZoomOutOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            flowContext?.getFlowPanelContext()?.zoom(false);
-                        }}
-                    />
-                </Tooltip>
-                <Tooltip className={"flow-panel-control-content-item"} placement="top" title={"自适应"}>
-                    <MonitorOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            flowContext?.getFlowPanelContext()?.resetZoom();
-                        }}
-                    />
-                </Tooltip>
-                <Tooltip className={"flow-panel-control-content-item"} placement="top" title={"上一步"}>
-                    <ArrowLeftOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            flowContext?.getFlowPanelContext()?.undo();
-                        }}
-                    />
-                </Tooltip>
-                <Tooltip className={"flow-panel-control-content-item"} placement="top" title={"下一步"}>
-                    <ArrowRightOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            flowContext?.getFlowPanelContext()?.redo();
-                        }}
-                    />
-                </Tooltip>
-                <Tooltip className={"flow-panel-control-content-item"} placement="top" title={"小地图"}>
-                    <EnvironmentOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            setMapVisible(!mapVisible);
-                        }}
-                    />
-                </Tooltip>
-                <Tooltip className={"flow-panel-control-content-item"} placement="top" title={"下载图片"}>
-                    <ArrowDownOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            flowContext?.getFlowPanelContext()?.download();
-                        }}
-                    />
-                </Tooltip>
-
-            </div>
-        </div>
-    )
-}
-
-export default ControlPanel;
diff --git a/admin-pro-ui/src/components/flow/panel/NodePanel.scss b/admin-pro-ui/src/components/flow/panel/NodePanel.scss
deleted file mode 100644
index 8bb1c19a..00000000
--- a/admin-pro-ui/src/components/flow/panel/NodePanel.scss
+++ /dev/null
@@ -1,29 +0,0 @@
-@use "../index" as *;
-
-.flow-panel-nodes {
-  position: absolute;
-  left: 35px;
-  min-width: 180px;
-  margin-top: 10px;
-  background-color: $flow-background-color;
-  box-shadow: 0 0 10px 1px $flow-box-shadow-color;
-  border-radius: 6px;
-  z-index: 101;
-
-  .flow-panel-nodes-title {
-    text-align: center;
-  }
-
-  .flow-panel-nodes-content {
-    margin: 10px;
-
-    .flow-panel-nodes-content-item {
-      cursor: pointer;
-      user-select: none;
-      margin-top: 10px;
-      margin-bottom: 10px;
-    }
-  }
-
-}
-
diff --git a/admin-pro-ui/src/components/flow/panel/NodePanel.tsx b/admin-pro-ui/src/components/flow/panel/NodePanel.tsx
deleted file mode 100644
index 66303005..00000000
--- a/admin-pro-ui/src/components/flow/panel/NodePanel.tsx
+++ /dev/null
@@ -1,103 +0,0 @@
-import React from "react";
-import {StartView} from "@/components/flow/nodes/Start";
-import GroovyScript from "@/components/flow/utils/script";
-import {NodeView} from "@/components/flow/nodes/Node";
-import {OverView} from "@/components/flow/nodes/Over";
-import {CirculateView} from "@/components/flow/nodes/Circulate";
-import {NodeType} from "@/components/flow/types";
-import "./NodePanel.scss";
-import FlowContext from "@/components/flow/domain/FlowContext";
-
-
-const NodePanel = () => {
-
-    const flowContext = FlowContext.getInstance();
-
-    const items = [
-        {
-            type: 'start-node',
-            view: <StartView name={"开始节点"}/>,
-            properties: {
-                name: '开始节点',
-                code: 'start',
-                type: 'START',
-                view: 'default',
-                operatorMatcher: GroovyScript.anyOperatorMatcher,
-                editable: true,
-                titleGenerator: GroovyScript.defaultTitleGenerator,
-                errTrigger: '',
-                approvalType: 'UN_SIGN',
-                timeout: 0
-            }
-        },
-        {
-            type: 'node-node',
-            view: <NodeView name={"流程节点"}/>,
-            properties: {
-                name: '流程节点',
-                code: 'flow',
-                type: 'APPROVAL',
-                view: 'default',
-                operatorMatcher: GroovyScript.anyOperatorMatcher,
-                editable: true,
-                titleGenerator: GroovyScript.defaultTitleGenerator,
-                errTrigger: '',
-                approvalType: 'SIGN',
-                timeout: 0
-            }
-        },
-        {
-            type: 'over-node',
-            view: <OverView name={"结束节点"}/>,
-            properties: {
-                name: '结束节点',
-                code: 'over',
-                type: 'OVER',
-                view: 'default',
-                operatorMatcher: GroovyScript.creatorOperatorMatcher,
-                editable: true,
-                titleGenerator: GroovyScript.defaultTitleGenerator,
-                errTrigger: '',
-                approvalType: 'UN_SIGN',
-                timeout: 0
-            }
-        },
-        {
-            type: 'circulate-node',
-            view: <CirculateView name={"抄送节点"}/>,
-            properties: {
-                name: '抄送节点',
-                code: 'circulate',
-                type: 'CIRCULATE',
-                view: 'default',
-                operatorMatcher: GroovyScript.creatorOperatorMatcher,
-                editable: true,
-                titleGenerator: GroovyScript.defaultTitleGenerator,
-                errTrigger: '',
-                approvalType: 'CIRCULATE',
-                timeout: 0
-            }
-        }
-    ];
-
-    return (
-        <div className={"flow-panel-nodes"}>
-            <h3 className={"flow-panel-nodes-title"}>流程节点</h3>
-            <div className={"flow-panel-nodes-content"}>
-                {items && items.map((item)=>{
-                    return (
-                        <div className={"flow-panel-nodes-content-item"}
-                             onMouseDown={()=>{
-                                 flowContext.getFlowPanelContext()?.addNode(item.type as NodeType,item.properties);
-                             }}
-                        >
-                            {item.view}
-                        </div>
-                    );
-                })}
-            </div>
-        </div>
-    )
-}
-
-export default NodePanel;
diff --git a/admin-pro-ui/src/components/flow/register/flow.register.tsx b/admin-pro-ui/src/components/flow/register/flow.register.tsx
deleted file mode 100644
index 13ea4a43..00000000
--- a/admin-pro-ui/src/components/flow/register/flow.register.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import ComponentBus from "@/framework/ComponentBus";
-import PostponedFormView from "@/components/flow/components/PostponedFormView";
-import {
-    PostponedFormViewKey,
-    UserSelectFormViewKey,
-} from "@/components/flow/types";
-import UserSelectView from "@/components/flow/components/UserSelectView";
-
-ComponentBus.getInstance().registerComponent(PostponedFormViewKey, PostponedFormView);
-ComponentBus.getInstance().registerComponent(UserSelectFormViewKey, UserSelectView);
diff --git a/admin-pro-ui/src/components/flow/store/FlowSlice.ts b/admin-pro-ui/src/components/flow/store/FlowSlice.ts
deleted file mode 100644
index ab1f5bdd..00000000
--- a/admin-pro-ui/src/components/flow/store/FlowSlice.ts
+++ /dev/null
@@ -1,124 +0,0 @@
-import {configureStore, createSlice, PayloadAction} from '@reduxjs/toolkit';
-import {FlowResultMessage, UserSelectFormType} from "@/components/flow/types";
-
-export interface FlowStore {
-    // 流程记录ID
-    recordId: string;
-    // 请求加载中
-    requestLoading: boolean;
-    // 流程结果
-    result: FlowResultMessage | null;
-    // 隐藏page的内容
-    contentHiddenVisible: boolean;
-    // 版本号
-    version: number;
-    // 数据版本号
-    dataVersion: number;
-
-    // 意见框展示状态
-    opinionVisible: boolean;
-
-    // 延期时间窗口状态
-    postponedVisible: boolean;
-    // 选人窗口状态
-    userSelectVisible: boolean;
-    // 选人状态
-    userSelectMode: UserSelectMode | null;
-}
-
-export interface UserSelectMode {
-    // 指定人员范围
-    specifyUserIds?: number[];
-    // 当前选择的人员
-    currentUserIds?: number[];
-    // 选人类型
-    userSelectType: UserSelectFormType;
-    // 是否多选
-    multiple: boolean;
-}
-
-export type FlowStoreAction = {
-    updateState: (state: FlowStore, action: PayloadAction<any>) => void;
-    initState: (state: FlowStore) => void;
-}
-
-export const flowSlice = createSlice<FlowStore, FlowStoreAction, "flow", {}>({
-    name: 'flow',
-    initialState: {
-        recordId: '',
-        requestLoading: false,
-        result: null,
-        contentHiddenVisible: false,
-        postponedVisible: false,
-        opinionVisible: true,
-        userSelectVisible: false,
-        userSelectMode: null,
-        version: 0,
-        dataVersion: 0,
-    },
-    reducers: {
-        updateState: (state, action) => {
-            const currentState = action.payload;
-            const keys = Object.keys(currentState);
-            if (keys.includes('requestLoading')) {
-                state.requestLoading = currentState.requestLoading;
-            }
-            if (keys.includes('recordId')) {
-                state.recordId = action.payload.recordId;
-            }
-            if (keys.includes('result')) {
-                state.result = action.payload.result;
-                state.contentHiddenVisible = state.result != null;
-            }
-            if (keys.includes('postponedVisible')) {
-                state.postponedVisible = action.payload.postponedVisible;
-            }
-
-            if (keys.includes('userSelectMode')) {
-                state.userSelectVisible = true;
-                state.userSelectMode = action.payload.userSelectMode;
-            }
-
-            if (keys.includes('version')) {
-                state.version = action.payload.version;
-            }
-
-            if (keys.includes('dataVersion')) {
-                state.dataVersion = action.payload.dataVersion;
-            }
-
-            if (keys.includes('userSelectVisible')) {
-                state.userSelectVisible = action.payload.userSelectVisible;
-                if (!state.userSelectVisible) {
-                    state.userSelectMode = null;
-                }
-            }
-        },
-        initState: (state) => {
-            state.recordId = '';
-            state.requestLoading = false;
-            state.result = null;
-            state.postponedVisible = false;
-            state.opinionVisible = true;
-            state.contentHiddenVisible = false;
-            state.userSelectVisible = false;
-            state.userSelectMode = null;
-            state.version = 0;
-            state.dataVersion = 0;
-        }
-    },
-});
-
-
-export const {
-    updateState,
-    initState
-} = flowSlice.actions;
-export const flowStore = configureStore({
-    reducer: {
-        flow: flowSlice.reducer
-    },
-});
-
-export type FlowReduxState = ReturnType<typeof flowStore.getState>;
-
diff --git a/admin-pro-ui/src/components/flow/types.ts b/admin-pro-ui/src/components/flow/types.ts
deleted file mode 100644
index 3c1bc2d6..00000000
--- a/admin-pro-ui/src/components/flow/types.ts
+++ /dev/null
@@ -1,179 +0,0 @@
-import {FormInstance} from "@codingapi/ui-framework";
-
-export type NodeState = "done" | "wait" | "undone" | "current";
-
-// 节点类型
-export type NodeType = 'start-node' | 'node-node' | 'over-node' | 'circulate-node';
-
-// 流程图中线的类型
-export type EdgeType = 'line' | 'polyline' | 'bezier';
-
-
-// 延期表单视图Key
-export const PostponedFormViewKey = 'PostponedFormView';
-// 选人表单视图Key
-export const UserSelectFormViewKey = 'UserSelectFormViewKey';
-
-
-// 延期表单 【拓展视图】
-export interface PostponedFormProps {
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    onFinish: (timeout: number) => void;
-}
-
-
-// 选人表单 【拓展视图】
-export type UserSelectFormType =
-// 选择下级流程节点的人员，约定人员id范围
-    'nextNodeUser'
-    // 选择转办人员，约定本单位下的人员
-    | 'transfer'
-    // 选择所有人员，在流程配置上使用
-    | 'users';
-
-export interface UserSelectFormProps {
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    onFinish: (values: FlowUser[]) => void;
-    // 选择模式
-    multiple: boolean;
-    // 指定人员范围
-    specifyUserIds?: number[];
-    // 当前选择的人员
-    currentUserIds?: number[];
-    // 选人方式
-    userSelectType: UserSelectFormType;
-}
-
-// 流程用户
-export interface FlowUser {
-    id: string;
-    name: string;
-
-    [key: string]: any;
-}
-
-// 自定义按钮类型
-export type ButtonType =
-    | 'RELOAD'  // 重新加载
-    | 'SAVE'    // 保存
-    | 'START'   // 发起
-    | 'SUBMIT'  // 提交
-    | 'TRY_SUBMIT'  // 预提交
-    | 'SPECIFY_SUBMIT'  // 指定人员提交
-    | 'REJECT'  // 驳回
-    | 'TRANSFER'    // 转办
-    | 'RECALL'  // 撤销
-    | 'POSTPONED'   // 延期
-    | 'URGE'    // 催办
-    | 'CUSTOM'  // 自定义后端接口
-    | 'VIEW'    // 自定义前端事件
-    | 'REMOVE'; // 删除
-
-
-// 流程自定义按钮
-export interface FlowButton {
-    id: string;
-    eventKey: string;
-    groovy: string;
-    name: string;
-    order: number;
-    style: any;
-    type: ButtonType;
-}
-
-// 节点属性
-export interface NodeProperties {
-    name: string;
-    code: string;
-    type:string;
-    view: string;
-    operatorMatcher:string;
-    editable:boolean;
-    titleGenerator:string;
-    errTrigger:string;
-    approvalType:string;
-    timeout:number;
-
-    settingVisible?: boolean;
-    flowState?: NodeState;
-}
-
-// 节点按钮属性
-export interface NodeButtonProperties {
-    id:string;
-    name:string;
-    type:ButtonType;
-    style:string;
-    order:number;
-    groovy:string;
-    eventKey:string;
-}
-
-
-// 流程设置面板属性
-export interface SettingPanelProps {
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    properties: any;
-    onSettingChange: (values: any) => void;
-}
-
-// 结果展示数据项目
-export interface FlowResultItem {
-    label: string,
-    value: string
-}
-
-
-type FlowResultMessageState = 'success'|'info'|'warning';
-
-// 结果展示数据信息
-export interface FlowResultMessage {
-    title: string,
-    closeable: boolean,
-    state: FlowResultMessageState,
-    items?: FlowResultItem[]
-}
-
-// 表单参数
-export interface FlowFormParams {
-    clazzName: string;
-
-    [key: string]: any;
-}
-
-// 流程表单数据
-export interface FlowFormViewProps {
-    // 表单数据
-    data: FlowFormParams;
-    // 表单控制对象
-    form: FormInstance;
-    // 数据版本
-    dataVersion?: number;
-}
-
-// 表单视图
-export interface FlowFormView {
-    [key: string]: React.ComponentType<FlowFormViewProps>;
-}
-
-export interface FlowViewProps {
-    // 流程编号
-    id?: string;
-    // 流程的设计编号
-    workCode?: string;
-
-    visible:boolean;
-
-    setVisible:(visible:boolean)=>void;
-
-    // 预览模式
-    review?: boolean;
-
-    // 流程的视图数据
-    view: React.ComponentType<FlowFormViewProps> | FlowFormView;
-    // 表单参数，参数仅当在发起节点时才会传递
-    formParams?: FlowFormParams;
-}
diff --git a/admin-pro-ui/src/components/flow/utils/script.ts b/admin-pro-ui/src/components/flow/utils/script.ts
deleted file mode 100644
index ab605d87..00000000
--- a/admin-pro-ui/src/components/flow/utils/script.ts
+++ /dev/null
@@ -1,61 +0,0 @@
-class GroovyScript {
-
-    public static defaultOutTrigger = "def run(content) {return true;}";
-    public static defaultTitleGenerator = "def run(content){ return content.getCurrentOperator().getName() + '-' + content.getFlowWork().getTitle() + '-' + content.getFlowNode().getName();}";
-
-    public static anyOperatorMatcher="def run(content) {return [content.getCurrentOperator().getUserId()];}";
-    public static creatorOperatorMatcher="def run(content) {return [content.getCreateOperator().getUserId()];}";
-    public static specifyOperatorMatcher="def run(content) {return [%s];}";
-
-
-    static operatorMatcherType(operatorMatcher: string) {
-        if (operatorMatcher === GroovyScript.anyOperatorMatcher) {
-            return "any";
-        } else if (operatorMatcher === GroovyScript.creatorOperatorMatcher) {
-            return "creator";
-        } else {
-            return "custom";
-        }
-    }
-
-
-    static getOperatorUsers(script:string) {
-        if(script) {
-            const match = script.match(/\[([\d,\s]+)\]/);
-            if (match && match[1]) {
-                return match[1]
-                    .split(',')
-                    .map(num => parseInt(num.trim(), 10));
-            }
-        }
-        return [];
-    }
-
-    static errTriggerType(errTrigger: string) {
-        if (errTrigger === GroovyScript.defaultOutTrigger) {
-            return "default";
-        } else {
-            return "custom";
-        }
-    }
-
-    static titleGeneratorType = (titleGenerator: string) => {
-        if (titleGenerator === GroovyScript.defaultTitleGenerator) {
-            return "default";
-        } else {
-            return "custom";
-        }
-    }
-
-    static operatorMatcher(operatorMatcherType: string) {
-        if (operatorMatcherType === "any") {
-            return GroovyScript.anyOperatorMatcher;
-        } else if (operatorMatcherType === "creator") {
-            return GroovyScript.creatorOperatorMatcher;
-        } else {
-            return GroovyScript.specifyOperatorMatcher;
-        }
-    }
-}
-
-export default GroovyScript;
diff --git a/admin-pro-ui/src/components/flow/view/FlowModelView.scss b/admin-pro-ui/src/components/flow/view/FlowModelView.scss
deleted file mode 100644
index f7906725..00000000
--- a/admin-pro-ui/src/components/flow/view/FlowModelView.scss
+++ /dev/null
@@ -1,26 +0,0 @@
-.flow-modal.ant-modal {
-  width: 100% !important;
-  top: 0 !important;
-  max-width: 100% !important;
-}
-.flow-modal.ant-modal.ant-modal-content {
-  height: 100vh !important;
-}
-
-.flow-modal {
-  margin: 0 !important;
-  padding: 0 !important;
-  width: 100vw !important;
-  height: 100vh !important;
-  overflow-y: hidden;
-
-  .ant-modal-content{
-    width: 100vw !important;
-    height: 100vh !important;
-  }
-
-  .ant-modal-footer{
-    margin: 0 !important;
-  }
-}
-
diff --git a/admin-pro-ui/src/components/flow/view/FlowModelView.tsx b/admin-pro-ui/src/components/flow/view/FlowModelView.tsx
deleted file mode 100644
index ec7a6c13..00000000
--- a/admin-pro-ui/src/components/flow/view/FlowModelView.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import {FlowViewProps} from "@/components/flow/types";
-import React from "react";
-import {Modal} from "antd";
-import FlowView from "@/components/flow/view/index";
-import "./FlowModelView.scss";
-
- const FlowModelView:React.FC<FlowViewProps> = (props)=>{
-    return (
-        <Modal
-            className={"flow-modal"}
-            open={props.visible}
-            onCancel={()=>{
-                props.setVisible(false);
-            }}
-            onOk={()=>{
-                props.setVisible(false);
-            }}
-            onClose={()=>{
-                props.setVisible(false);
-            }}
-            destroyOnClose={true}
-            footer={false}
-            closable={false}
-        >
-            <FlowView
-                {...props}
-            />
-        </Modal>
-    )
-}
-
-export default FlowModelView;
diff --git a/admin-pro-ui/src/components/flow/view/index.scss b/admin-pro-ui/src/components/flow/view/index.scss
deleted file mode 100644
index 84d70004..00000000
--- a/admin-pro-ui/src/components/flow/view/index.scss
+++ /dev/null
@@ -1,65 +0,0 @@
-@use "@/config/variables" as *;
-$flow-footer-height: 80px;
-
-
-.flow-skeleton-header {
-  width: 100%;
-  height: 40px;
-}
-
-.flow-skeleton-body {
-  height: 60vh;
-  width: 100%;
-}
-
-.flow-view {
-  background-color: white !important;
-  width: 100%;
-}
-
-
-.flow-chart {
-  transition: 0.3s;
-  border-radius: 12px;
-  text-align: center;
-
-  .flow-chart-content {
-    width: 0;
-    height: 0;
-  }
-
-  .flow-img {
-    width: 30vw;
-  }
-}
-
-
-.flow-header{
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-
-  .flow-header-left{
-    font-size: $title-font-size;
-  }
-
-  .flow-header-right{
-
-  }
-
-}
-
-.flow-buttons-content {
-  display: flex;
-  justify-content: center;
-
-  .flow-buttons-item {
-    font-size: 14px;
-    margin: 5px 5px;
-    padding-left: 20px;
-    padding-right: 20px;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-  }
-}
diff --git a/admin-pro-ui/src/components/flow/view/index.tsx b/admin-pro-ui/src/components/flow/view/index.tsx
deleted file mode 100644
index 9539ba0b..00000000
--- a/admin-pro-ui/src/components/flow/view/index.tsx
+++ /dev/null
@@ -1,109 +0,0 @@
-import React, {createContext, useEffect} from "react";
-import {FlowViewProps} from "@/components/flow/types";
-import {FormInstance} from "@codingapi/ui-framework";
-import {FlowButtonClickContext} from "@/components/flow/domain/FlowButtonClickContext";
-import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
-import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
-import {FlowEventContext} from "@/components/flow/domain/FlowEventContext";
-import {FlowRecordContext} from "@/components/flow/domain/FlowRecordContext";
-import {FlowReduxState, flowStore, initState, updateState} from "@/components/flow/store/FlowSlice";
-import {detail} from "@/api/flow";
-import {Provider, useDispatch, useSelector} from "react-redux";
-import {Skeleton} from "antd";
-import FlowPage from "@/components/flow/components/FlowPage";
-import "./index.scss";
-
-// 流程视图上下文属性
-interface FlowViewReactContextProps {
-    // 流程的详情控制上下文对象
-    flowRecordContext: FlowRecordContext;
-    // 流程的事件控制上下文对象
-    flowEventContext: FlowEventContext;
-    // 流程的状态数据上下文对象
-    flowStateContext: FlowStateContext;
-    // 流程事件触发控制上下文对象
-    flowTriggerContext: FlowTriggerContext;
-    // 流程按钮点击触发控制器上下文对象
-    flowButtonClickContext: FlowButtonClickContext;
-    // 表单操作对象
-    formInstance: FormInstance;
-    // 审批意见操作对象
-    opinionInstance: FormInstance;
-}
-
-export const FlowViewReactContext = createContext<FlowViewReactContextProps | null>(null);
-
-
-const $FlowView: React.FC<FlowViewProps> = (props) => {
-
-    const [data, setData] = React.useState<any>(null);
-
-    const dispatch = useDispatch();
-
-    const version = useSelector((state: FlowReduxState) => state.flow.version);
-
-    // 请求流程详情数据
-    const loadFlowDetail = () => {
-        if (props.id) {
-            detail(props.id, null).then(res => {
-                if (res.success) {
-                    setData(res.data);
-                }
-            });
-            return;
-        }
-        if (props.workCode) {
-            detail(null, props.workCode).then(res => {
-                if (res.success) {
-                    setData(res.data);
-                }
-            });
-            return;
-        }
-    }
-
-    useEffect(() => {
-        if (data) {
-            const dataVersion = Math.random();
-            dispatch(updateState({dataVersion: dataVersion}));
-        }
-    }, [data]);
-
-    useEffect(() => {
-        return () => {
-            dispatch(initState());
-        }
-    }, []);
-
-    useEffect(() => {
-        loadFlowDetail();
-    }, [version]);
-
-    return (
-        <>
-            {!data && (
-                <>
-                    <Skeleton active={true} className={"flow-skeleton-header"}/>
-                    <Skeleton paragraph={{rows: 4}} active={true} className={"flow-skeleton-body"}/>
-                </>
-            )}
-            {data && (
-                <FlowPage
-                    {...props}
-                    flowData={data}
-                />
-            )}
-        </>
-    )
-}
-
-const FlowView: React.FC<FlowViewProps> = (props) => {
-    return (
-        <Provider store={flowStore}>
-            <$FlowView  {...props} />
-        </Provider>
-    )
-}
-
-export default FlowView;
-
diff --git a/admin-pro-ui/src/pages/flow/record/index.tsx b/admin-pro-ui/src/pages/flow/record/index.tsx
index 2108476c..fada0816 100644
--- a/admin-pro-ui/src/pages/flow/record/index.tsx
+++ b/admin-pro-ui/src/pages/flow/record/index.tsx
@@ -13,7 +13,7 @@ import moment from "moment";
 import {message, Tabs} from "antd";
 import "./index.scss";
 import LeaveForm from "@/pages/flow/leave/LeaveForm";
-import FlowModelView from "@/components/flow/view/FlowModelView";
+import {FlowModelView} from "@codingapi/flow-pc";
 
 const FlowRecordPage = () => {
 
diff --git a/admin-pro-ui/src/pages/flow/work/index.tsx b/admin-pro-ui/src/pages/flow/work/index.tsx
index f241d93f..4c0719b2 100644
--- a/admin-pro-ui/src/pages/flow/work/index.tsx
+++ b/admin-pro-ui/src/pages/flow/work/index.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import Flow, {FlowActionType} from "@/components/flow";
+import {Flow,FlowActionType} from "@codingapi/flow-pc";
 import {ActionType, PageContainer, ProTable} from "@ant-design/pro-components";
 import {changeState, copy, list, remove, save, schema} from "@/api/flow";
 import {Button, Drawer, message, Modal, Popconfirm, Space} from "antd";

From 585a98ba7a1c7ba847c5fc279bb06934d243eee1 Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Mon, 28 Apr 2025 11:25:31 +0800
Subject: [PATCH 15/20] remove flow

---
 admin-pro-ui/package.json                     |  2 +-
 .../src/components/descriptions/index.scss    | 34 -------
 .../src/components/descriptions/index.tsx     | 99 -------------------
 admin-pro-ui/src/components/flow/register.tsx | 67 +++++++++++++
 .../src/config/register.component.tsx         |  1 +
 admin-pro-ui/src/index.tsx                    |  1 +
 .../src/pages/flow/leave/LeaveForm.tsx        |  2 +-
 admin-pro-ui/src/pages/flow/leave/index.tsx   |  2 +-
 8 files changed, 72 insertions(+), 136 deletions(-)
 delete mode 100644 admin-pro-ui/src/components/descriptions/index.scss
 delete mode 100644 admin-pro-ui/src/components/descriptions/index.tsx
 create mode 100644 admin-pro-ui/src/components/flow/register.tsx

diff --git a/admin-pro-ui/package.json b/admin-pro-ui/package.json
index 47ce3e7b..7f33c151 100644
--- a/admin-pro-ui/package.json
+++ b/admin-pro-ui/package.json
@@ -7,7 +7,7 @@
     "@ant-design/icons": "^5.4.0",
     "@ant-design/pro-components": "^2.8.2",
     "@babel/standalone": "^7.25.6",
-    "@codingapi/flow-pc": "^0.0.3",
+    "@codingapi/flow-pc": "^0.0.8",
     "@codingapi/form-pc": "^0.0.16",
     "@codingapi/ui-framework": "^0.0.12",
     "@dnd-kit/core": "^6.2.0",
diff --git a/admin-pro-ui/src/components/descriptions/index.scss b/admin-pro-ui/src/components/descriptions/index.scss
deleted file mode 100644
index bd0d0289..00000000
--- a/admin-pro-ui/src/components/descriptions/index.scss
+++ /dev/null
@@ -1,34 +0,0 @@
-@use "@/config/variables" as *;
-
-.descriptions-list {
-  padding: 3px;
-  background-color: white;
-
-  .descriptions-list-item {
-    background-color: white;
-    padding: 15px;
-    font-size: $content-font-size;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    border-bottom: 1px solid $body-background-color;
-
-    .descriptions-list-item-label {
-      font-weight: bold;
-    }
-
-    .descriptions-list-item-value {
-    }
-  }
-
-  .form-header-title {
-    width: 100%;
-    height: 20px;
-    border-left: 4px solid $theme-primary-color;
-    padding-left: 4px;
-    font-size: 14px;
-    margin-bottom: 10px;
-  }
-}
-
-
diff --git a/admin-pro-ui/src/components/descriptions/index.tsx b/admin-pro-ui/src/components/descriptions/index.tsx
deleted file mode 100644
index 8e2c7427..00000000
--- a/admin-pro-ui/src/components/descriptions/index.tsx
+++ /dev/null
@@ -1,99 +0,0 @@
-import React, {useEffect, useImperativeHandle} from "react";
-import {FormField} from "@codingapi/ui-framework";
-import "./index.scss";
-
-export interface DescriptionsAction {
-    // 重新刷新数据
-    reload: () => void;
-}
-
-// 详情展示属性
-interface DescriptionsProps {
-    // 展示的字段
-    columns?: FormField[];
-    // 请求数据
-    request?: () => Promise<any>;
-    // 操作对象
-    actionRef?: React.Ref<DescriptionsAction>;
-    // 页脚
-    footer?: React.ReactNode;
-    // 页头
-    header?: React.ReactNode;
-    // 数据转换
-    dataConvert?: (field: FormField, data: any) => Promise<any>;
-}
-
-// 详情展示
-const Descriptions: React.FC<DescriptionsProps> = (props) => {
-
-    const [data, setData] = React.useState<any>(null);
-
-    const reload = () => {
-        if (props.request) {
-            props.request().then((data) => {
-                if(props.dataConvert) {
-                    const promise = [] as Promise<any>[];
-                    props.columns?.map(item => {
-                        promise.push(new Promise<any>((resolve, reject) => {
-                            props.dataConvert?.(item, data).then(value => {
-                                data[item.props.name as string] = value;
-                                resolve(value);
-                            }).catch(reject);
-                        }));
-                    });
-                    Promise.all(promise).then(() => {
-                        setData(data);
-                    });
-                }else {
-                    setData(data);
-                }
-            })
-        }
-    }
-
-    useImperativeHandle(props.actionRef, () => ({
-        reload: () => {
-            reload()
-        }
-    }), [props.actionRef]);
-
-    useEffect(() => {
-        reload();
-
-        return () => {
-            setData(null);
-        }
-    }, []);
-
-    return (
-        <div className={"descriptions-list"}>
-            {props.header}
-            {data && props.columns && props.columns
-                .filter(item => !item.props.hidden)
-                .map((item) => {
-                    const key = item.props.name;
-                    const label = item.props.label as string || "";
-                    const value = data[key as string];
-                    const valueType = typeof value === 'object' ? 'object' : 'string';
-                    return (
-                        <div className={"descriptions-list-item"}>
-                            <div className={"descriptions-list-item-label"}
-                                 dangerouslySetInnerHTML={{__html: label }}/>
-                            {valueType === 'string' && (
-                                <div className={"descriptions-list-item-value"}
-                                     dangerouslySetInnerHTML={{__html: value}}/>
-                            )}
-                            {valueType === 'object' && (
-                                <div className={"descriptions-list-item-value"}>
-                                    {value}
-                                </div>
-                            )}
-                        </div>
-                    )
-                })}
-            {props.footer}
-        </div>
-    )
-}
-
-export default Descriptions;
diff --git a/admin-pro-ui/src/components/flow/register.tsx b/admin-pro-ui/src/components/flow/register.tsx
new file mode 100644
index 00000000..a6afa6ca
--- /dev/null
+++ b/admin-pro-ui/src/components/flow/register.tsx
@@ -0,0 +1,67 @@
+import * as flowApi from "@/api/flow";
+import {UserSelectFormViewKey} from "@codingapi/ui-framework";
+import {PostponedFormViewKey} from "@codingapi/ui-framework";
+import {ComponentBus} from "@codingapi/ui-framework";
+import {FlowApiContent,FlowApi} from "@codingapi/flow-pc";
+import UserSelectView from "@/components/flow/UserSelectView";
+import PostponedFormView from "@/components/flow/PostponedFormView";
+
+
+ComponentBus.getInstance().registerComponent(UserSelectFormViewKey,UserSelectView);
+ComponentBus.getInstance().registerComponent(PostponedFormViewKey,PostponedFormView);
+
+class DefaultFlowApiImpl implements FlowApi{
+
+    startFlow(body: any): Promise<any> {
+        return flowApi.startFlow(body);
+    }
+
+    submitFlow(body: any): Promise<any> {
+        return flowApi.submitFlow(body);
+    }
+
+    removeFlow(body: any): Promise<any> {
+        return flowApi.removeFlow(body);
+    }
+
+    saveFlow(body: any): Promise<any> {
+        return flowApi.saveFlow(body);
+    }
+
+    postponedFlow(body: any): Promise<any> {
+        return flowApi.postponed(body);
+    }
+
+    triggerCustomFlow(body: any): Promise<any> {
+        return flowApi.custom(body);
+    }
+
+    transferFlow(body: any): Promise<any> {
+        return flowApi.transfer(body);
+    }
+
+    urgeFlow(body: any): Promise<any> {
+        return flowApi.urge(body);
+    }
+
+    recallFlow(body: any): Promise<any> {
+        return flowApi.recall(body);
+    }
+
+    trySubmitFlow(body: any): Promise<any> {
+        return flowApi.trySubmitFlow(body);
+    }
+
+    getDetailById(id: string): Promise<any> {
+        return flowApi.detail(id,null);
+    }
+
+    getDetailByWorkCode(workCode: string): Promise<any> {
+        return flowApi.detail(null,workCode);
+    }
+
+}
+
+FlowApiContent.getInstance().registerFlowApi(new DefaultFlowApiImpl());
+
+console.log('register flow api');
diff --git a/admin-pro-ui/src/config/register.component.tsx b/admin-pro-ui/src/config/register.component.tsx
index e69de29b..a996c631 100644
--- a/admin-pro-ui/src/config/register.component.tsx
+++ b/admin-pro-ui/src/config/register.component.tsx
@@ -0,0 +1 @@
+import "@/components/flow/register";
diff --git a/admin-pro-ui/src/index.tsx b/admin-pro-ui/src/index.tsx
index 73dd6242..3cbfbf44 100644
--- a/admin-pro-ui/src/index.tsx
+++ b/admin-pro-ui/src/index.tsx
@@ -8,6 +8,7 @@ import {ConfigProvider} from "antd";
 import zhCN from 'antd/es/locale/zh_CN';
 import {theme} from "@/config/theme";
 import './index.scss';
+import "@/config/register.component";
 
 const root = ReactDOM.createRoot(
     document.getElementById('root') as HTMLElement
diff --git a/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx b/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
index 26926214..8f1cfbc4 100644
--- a/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
+++ b/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
@@ -1,5 +1,5 @@
 import React, {useEffect} from "react";
-import {FlowFormViewProps} from "@/components/flow/types";
+import {FlowFormViewProps} from "@codingapi/ui-framework";
 import {Form,FormInput,FormTextArea} from "@codingapi/form-pc";
 import {ValidateUtils} from "@codingapi/ui-framework";
 
diff --git a/admin-pro-ui/src/pages/flow/leave/index.tsx b/admin-pro-ui/src/pages/flow/leave/index.tsx
index 14f38ec7..bd1470fb 100644
--- a/admin-pro-ui/src/pages/flow/leave/index.tsx
+++ b/admin-pro-ui/src/pages/flow/leave/index.tsx
@@ -3,7 +3,7 @@ import {ActionType, PageContainer, ProTable} from "@ant-design/pro-components";
 import {list} from "@/api/leave";
 import {Button} from "antd";
 import LeaveForm from "@/pages/flow/leave/LeaveForm";
-import FlowModelView from "@/components/flow/view/FlowModelView";
+import {FlowModelView} from "@codingapi/flow-pc";
 
 const LeavePage = () => {
 

From 9e144542b76b7f8254415fbdf537d59a7ef89440 Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Mon, 28 Apr 2025 20:26:39 +0800
Subject: [PATCH 16/20] update mobile

---
 admin-pro-ui/.gitignore                       |  28 -
 admin-pro-ui/README.md                        |  33 -
 admin-pro-ui/__mocks__/axios.ts               |  37 -
 admin-pro-ui/__mocks__/fileMock.js            |   1 -
 admin-pro-ui/__mocks__/monaco-editor.js       |   9 -
 admin-pro-ui/jest.config.ts                   |  41 --
 admin-pro-ui/mocks/index.js                   |   7 -
 admin-pro-ui/mocks/product.js                 |  16 -
 admin-pro-ui/mocks/user.js                    |  28 -
 admin-pro-ui/package.json                     |  98 ---
 admin-pro-ui/public/favicon.ico               | Bin 3870 -> 0 bytes
 admin-pro-ui/public/index.html                |  36 -
 admin-pro-ui/public/logo.png                  | Bin 5347 -> 0 bytes
 admin-pro-ui/react-jest.md                    | 190 -----
 admin-pro-ui/scripts/.gitignore               |   1 -
 admin-pro-ui/scripts/deploy.sh                |   8 -
 admin-pro-ui/scripts/docker-compose.yaml      |  12 -
 admin-pro-ui/scripts/install.sh               |   3 -
 admin-pro-ui/scripts/package.sh               |   8 -
 admin-pro-ui/src/api/account.ts               |  32 -
 admin-pro-ui/src/api/flow.ts                  | 165 -----
 admin-pro-ui/src/api/index.ts                 | 124 ----
 admin-pro-ui/src/api/jar.ts                   |   9 -
 admin-pro-ui/src/api/leave.ts                 |  20 -
 admin-pro-ui/src/api/node.ts                  |  25 -
 admin-pro-ui/src/api/salary.ts                |  10 -
 admin-pro-ui/src/api/typings.d.ts             |  37 -
 admin-pro-ui/src/api/user.ts                  |  40 --
 admin-pro-ui/src/api/validate.ts              | 103 ---
 admin-pro-ui/src/assets/logo.svg              |   1 -
 admin-pro-ui/src/config/menus.tsx             |  59 --
 .../src/config/register.component.tsx         |   1 -
 admin-pro-ui/src/config/theme.tsx             |  28 -
 admin-pro-ui/src/declarations.d.ts            |   4 -
 .../src/framework/DynamicLoad/DynamicCode.tsx |  46 --
 .../src/framework/DynamicLoad/PageLoader.tsx  |  21 -
 .../src/framework/Permission/Access/index.tsx |  69 --
 .../Permission/AccessProvider/handler.ts      | 102 ---
 .../Permission/AccessProvider/index.tsx       |  41 --
 .../RoleKeyProvider/RoleKeyManager.ts         |  26 -
 .../Permission/RoleKeyProvider/index.tsx      |  43 --
 .../src/framework/Routes/MenuRouteManager.tsx | 207 ------
 .../src/framework/Routes/RoutesProvider.tsx   | 123 ----
 admin-pro-ui/src/index.scss                   |  10 -
 admin-pro-ui/src/index.tsx                    |  36 -
 admin-pro-ui/src/jest.setup.ts                |  47 --
 admin-pro-ui/src/layout/index.scss            |   3 -
 admin-pro-ui/src/layout/index.tsx             | 109 ---
 .../src/pages/flow/leave/LeaveForm.tsx        |  52 --
 admin-pro-ui/src/pages/flow/leave/index.tsx   |  71 --
 admin-pro-ui/src/pages/flow/record/index.scss |   7 -
 admin-pro-ui/src/pages/flow/record/index.tsx  | 328 ---------
 admin-pro-ui/src/pages/flow/user/index.tsx    | 252 -------
 admin-pro-ui/src/pages/flow/user/select.tsx   |  74 --
 admin-pro-ui/src/pages/flow/work/index.tsx    | 304 --------
 admin-pro-ui/src/pages/flow/work/select.tsx   |  96 ---
 admin-pro-ui/src/pages/form/index.tsx         | 588 ----------------
 admin-pro-ui/src/pages/login/index.tsx        | 159 -----
 admin-pro-ui/src/pages/welcome/index.scss     |  36 -
 admin-pro-ui/src/pages/welcome/index.tsx      |  21 -
 admin-pro-ui/src/react-app-env.d.ts           |   1 -
 admin-pro-ui/src/reportWebVitals.ts           |  15 -
 admin-pro-ui/src/store/CounterSlice.ts        |  32 -
 admin-pro-ui/src/store/MenuSlice.ts           |  24 -
 admin-pro-ui/src/store/Redux.tsx              |  13 -
 admin-pro-ui/src/utils/RoleControl.ts         |  92 ---
 admin-pro-ui/src/utils/base64.ts              |  28 -
 admin-pro-ui/src/utils/dynamicLoader.ts       | 108 ---
 admin-pro-ui/src/utils/index.ts               |  16 -
 admin-pro-ui/tsconfig.json                    |  30 -
 admin-pro-ui/webpack.common.js                |  96 ---
 admin-pro-ui/webpack.config.dev.js            |  21 -
 admin-pro-ui/webpack.config.mock.js           |  27 -
 admin-pro-ui/webpack.config.prod.js           |   9 -
 admin-ui/package.json                         |   8 +-
 .../public/captcha.jpeg                       | Bin
 admin-ui/public/index.html                    |   2 +-
 admin-ui/src/api/account.ts                   |   9 +-
 {admin-pro-ui => admin-ui}/src/api/oss.ts     |   0
 admin-ui/src/components/CodeEditor/index.tsx  | 117 ----
 .../Flow/components/PostponedFormView.tsx     |  41 --
 .../Flow/components/ResultFormView.tsx        |  76 --
 .../Flow/components/UserSelectView.tsx        |  66 --
 .../src/components/Flow/flow/FlowButtons.tsx  |  56 --
 .../src/components/Flow/flow/FlowChart.scss   |  19 -
 .../src/components/Flow/flow/FlowChart.tsx    |  79 ---
 .../src/components/Flow/flow/FlowDetail.tsx   | 122 ----
 .../src/components/Flow/flow/FlowHistory.tsx  | 115 ----
 .../components/Flow/flow/FlowHistoryLine.scss |  32 -
 .../components/Flow/flow/FlowHistoryLine.tsx  |  68 --
 .../src/components/Flow/flow/FlowTabs.tsx     | 109 ---
 .../src/components/Flow/flow/FlowTitle.tsx    |  49 --
 admin-ui/src/components/Flow/flow/data.ts     | 317 ---------
 admin-ui/src/components/Flow/flow/events.tsx  | 501 --------------
 admin-ui/src/components/Flow/flow/index.scss  | 149 ----
 admin-ui/src/components/Flow/flow/index.tsx   | 295 --------
 admin-ui/src/components/Flow/flow/types.ts    | 146 ----
 admin-ui/src/components/Flow/index.scss       |  38 -
 admin-ui/src/components/Flow/index.tsx        | 189 -----
 .../components/Flow/layout/ControlPanel.scss  |  18 -
 .../components/Flow/layout/ControlPanel.tsx   |  94 ---
 .../src/components/Flow/layout/NodePanel.scss |  13 -
 .../src/components/Flow/layout/NodePanel.tsx  | 112 ---
 .../Flow/nodes/Circulate/index.scss           |  49 --
 .../components/Flow/nodes/Circulate/index.tsx | 142 ----
 .../src/components/Flow/nodes/Node/index.scss |  49 --
 .../src/components/Flow/nodes/Node/index.tsx  | 131 ----
 .../src/components/Flow/nodes/Over/index.scss |  49 --
 .../src/components/Flow/nodes/Over/index.tsx  | 145 ----
 .../components/Flow/nodes/Start/index.scss    |  47 --
 .../src/components/Flow/nodes/Start/index.tsx | 128 ----
 .../src/components/Flow/nodes/StateLabel.tsx  |  46 --
 admin-ui/src/components/Flow/nodes/states.ts  |   2 -
 .../src/components/Flow/panel/ButtonPanel.tsx | 341 ---------
 .../src/components/Flow/panel/EdgePanel.tsx   | 192 ------
 .../src/components/Flow/panel/NodePanel.tsx   | 300 --------
 .../components/Flow/panel/ScriptModal.scss    |  30 -
 .../src/components/Flow/panel/ScriptModal.tsx | 162 -----
 .../src/components/Flow/panel/circulate.tsx   |  71 --
 admin-ui/src/components/Flow/panel/node.tsx   |  86 ---
 admin-ui/src/components/Flow/panel/over.tsx   |  51 --
 .../src/components/Flow/panel/panel.types.ts  |   7 -
 .../src/components/Flow/panel/shortcuts.ts    |  55 --
 admin-ui/src/components/Flow/panel/start.tsx  |  81 ---
 admin-ui/src/components/Flow/readme.md        |   1 -
 .../Flow/register/flow.register.tsx           |   9 -
 .../src/components/Flow/store/FlowSlice.ts    | 185 -----
 admin-ui/src/components/Flow/utils/index.ts   | 215 ------
 admin-ui/src/components/Flow/utils/script.ts  |  63 --
 .../src/components/Form/ProFormCode/index.tsx |  26 -
 .../components/Form/ProFormIcons/index.tsx    |  37 -
 .../components/Form/ProFormUploader/index.tsx |  21 -
 .../components/Layout/AvatarHeader/index.tsx  | 132 ----
 .../components/Layout/HeaderAction/index.tsx  |   6 -
 .../Layout/HeaderDropdown/index.tsx           |  15 -
 admin-ui/src/components/Layout/Page/index.tsx |  34 -
 .../src/components/View/MenuIcon/index.tsx    |  77 ---
 .../src/components/flow/PostponedFormView.tsx |   0
 .../src/components/flow/UserSelectView.tsx    |   0
 .../src/components/flow/register.tsx          |   0
 .../src/components/icons/index.tsx            |   0
 admin-ui/src/config/menus.tsx                 |  87 +--
 admin-ui/src/config/register.component.tsx    |   2 +-
 .../src/config/variables.scss                 |   0
 admin-ui/src/framework/ComponentBus/index.tsx |  14 -
 admin-ui/src/framework/EventBus/index.ts      |  58 --
 .../src/framework/Routes/MenuRouteManager.tsx |   4 +-
 .../src/framework/Routes/RoutesProvider.tsx   |   2 +-
 .../src/gateway/default/Header.tsx            |   0
 .../src/gateway/index.tsx                     |   0
 admin-ui/src/index.tsx                        |   1 +
 admin-ui/src/json/flow.json                   | 166 -----
 .../src/layout/AvatarHeader/index.tsx         |   0
 .../src/layout/HeaderAction/index.tsx         |   0
 .../src/layout/HeaderDropdown/index.tsx       |   0
 .../src/layout/NotFound/index.tsx             |   0
 admin-ui/src/layout/index.tsx                 |   7 +-
 admin-ui/src/layout/pages/Menu/index.scss     |   5 -
 admin-ui/src/layout/pages/Menu/index.tsx      | 276 --------
 admin-ui/src/layout/pages/NotFound/index.tsx  |  34 -
 admin-ui/src/pages/dynamic/test1.tsx          | 119 ----
 admin-ui/src/pages/dynamic/test2.tsx          | 205 ------
 admin-ui/src/pages/flow/leave/LeaveForm.tsx   | 123 +---
 admin-ui/src/pages/flow/leave/index.tsx       |  60 +-
 admin-ui/src/pages/flow/record/index.tsx      |  31 +-
 admin-ui/src/pages/flow/user/index.tsx        | 123 ++--
 .../pages/flow/work/__test__/index.test.tsx   |  63 --
 admin-ui/src/pages/flow/work/index.tsx        | 129 ++--
 admin-ui/src/pages/form/index.tsx             | 647 +++++++++++++++---
 admin-ui/src/pages/jar/index.tsx              |  73 --
 admin-ui/src/pages/menu/index.tsx             |   8 -
 .../src/pages/mirco/index.tsx                 |   0
 admin-ui/src/pages/node/index.tsx             | 231 -------
 admin-ui/src/pages/portal/Draggable.tsx       |  20 -
 admin-ui/src/pages/portal/Droppable.tsx       |  20 -
 admin-ui/src/pages/portal/index.tsx           |  11 -
 admin-ui/src/pages/redux/test1.tsx            |  35 -
 admin-ui/src/pages/redux/test2.tsx            |  37 -
 admin-ui/src/pages/role/index.tsx             |  19 -
 .../src/pages/salary/compoments/AGTable.tsx   | 107 ---
 .../pages/salary/compoments/SalaryTable1.tsx  | 112 ---
 .../pages/salary/compoments/SalaryTable2.tsx  | 159 -----
 admin-ui/src/pages/salary/data/table1.ts      |  58 --
 admin-ui/src/pages/salary/data/table2.ts      |  57 --
 admin-ui/src/pages/salary/index.tsx           |  82 ---
 admin-ui/src/pages/salary/store/salary.ts     |  64 --
 admin-ui/src/pages/salary/types.ts            |  22 -
 admin-ui/src/pages/user/index.tsx             |  45 --
 .../src/pages/welcome/__test__/index.test.tsx |  33 -
 admin-ui/src/pages/welcome/data.ts            |  18 -
 admin-ui/src/pages/welcome/index.tsx          |  64 +-
 admin-ui/src/portal/index.tsx                 |  10 -
 .../src/utils/captcha.ts                      |   0
 {admin-pro-ui => admin-ui}/src/utils/oss.ts   |   0
 {admin-pro-ui => admin-ui}/todo.md            |   0
 admin-ui/webpack.config.dev.js                |   2 +-
 admin-ui/webpack.config.mock.js               |   2 +-
 admin-ui/webpack.config.prod.js               |   2 +-
 mobile-ui/package.json                        |   3 +
 .../src/components/descriptions/index.scss    |  34 -
 .../src/components/descriptions/index.tsx     |  98 ---
 .../flow/{plugins => }/PostponedFormView.tsx  |   4 +-
 .../flow/{plugins => }/UserSelectFormView.tsx |   5 +-
 .../components/flow/components/FlowChart.tsx  |  93 ---
 .../flow/components/FlowContent.tsx           |  67 --
 .../components/flow/components/FlowFooter.tsx | 118 ----
 .../flow/components/FlowForm404.tsx           |  29 -
 .../flow/components/FlowFormOpinion.tsx       |  46 --
 .../flow/components/FlowHistory.tsx           | 167 -----
 .../flow/components/FlowHistoryLine.tsx       |  55 --
 .../flow/components/FlowOpinion.tsx           |  54 --
 .../components/flow/components/FlowPage.tsx   | 134 ----
 .../components/flow/components/FlowRecord.tsx |  29 -
 .../components/flow/components/FlowResult.tsx |  50 --
 .../flow/domain/FlowButtonClickContext.ts     | 316 ---------
 .../flow/domain/FlowEventContext.ts           | 348 ----------
 .../flow/domain/FlowRecordContext.ts          | 211 ------
 .../flow/domain/FlowResultParser.ts           |  92 ---
 .../flow/domain/FlowStateContext.tsx          |  95 ---
 .../flow/domain/FlowTriggerContext.ts         |  32 -
 .../flow/nodes/Circulate/index.scss           |  49 --
 .../components/flow/nodes/Circulate/index.tsx | 131 ----
 .../src/components/flow/nodes/Node/index.scss |  49 --
 .../src/components/flow/nodes/Node/index.tsx  | 121 ----
 .../src/components/flow/nodes/Over/index.scss |  49 --
 .../src/components/flow/nodes/Over/index.tsx  | 134 ----
 .../components/flow/nodes/Start/index.scss    |  47 --
 .../src/components/flow/nodes/Start/index.tsx | 118 ----
 .../src/components/flow/nodes/StateLabel.tsx  |  46 --
 mobile-ui/src/components/flow/nodes/states.ts |   2 -
 mobile-ui/src/components/flow/register.tsx    |  66 ++
 .../src/components/flow/register/index.tsx    |   8 -
 .../src/components/flow/store/FlowSlice.ts    | 124 ----
 mobile-ui/src/components/flow/types.ts        | 129 ----
 mobile-ui/src/components/flow/view/index.scss | 161 -----
 mobile-ui/src/components/flow/view/index.tsx  | 107 ---
 mobile-ui/src/components/form/captcha.tsx     |  57 --
 mobile-ui/src/components/form/cascader.tsx    | 113 ---
 mobile-ui/src/components/form/checkbox.tsx    |  79 ---
 mobile-ui/src/components/form/common.tsx      |  42 --
 mobile-ui/src/components/form/date.tsx        | 102 ---
 .../components/form/domain/FormInstance.tsx   | 314 ---------
 mobile-ui/src/components/form/factory.tsx     | 163 -----
 mobile-ui/src/components/form/form.scss       | 145 ----
 mobile-ui/src/components/form/index.tsx       | 135 ----
 mobile-ui/src/components/form/input.tsx       |  36 -
 mobile-ui/src/components/form/listener.ts     |  64 --
 mobile-ui/src/components/form/password.tsx    |  45 --
 mobile-ui/src/components/form/radio.tsx       |  57 --
 mobile-ui/src/components/form/rate.tsx        |  32 -
 mobile-ui/src/components/form/select.tsx      | 426 ------------
 mobile-ui/src/components/form/selector.tsx    |  73 --
 mobile-ui/src/components/form/slider.tsx      |  38 -
 mobile-ui/src/components/form/stepper.tsx     |  34 -
 mobile-ui/src/components/form/switch.tsx      |  44 --
 mobile-ui/src/components/form/textarea.tsx    |  35 -
 mobile-ui/src/components/form/types.tsx       | 165 -----
 mobile-ui/src/components/form/uploder.tsx     | 182 -----
 mobile-ui/src/components/form/utils.ts        |  30 -
 mobile-ui/src/components/form/validate.ts     |  91 ---
 .../src/components/info/FormInfo/index.tsx    |   4 +-
 .../src/framework/ComponentBus/index.tsx      |  78 ---
 mobile-ui/src/framework/EventBus/index.ts     |  58 --
 mobile-ui/src/pages/flow/detail.tsx           |   9 +-
 mobile-ui/src/pages/levave/create.tsx         |  10 +-
 mobile-ui/src/pages/levave/detail.tsx         |   2 +-
 mobile-ui/src/pages/levave/fields.ts          |   2 +-
 mobile-ui/src/pages/levave/form.tsx           |   6 +-
 mobile-ui/src/pages/login/index.tsx           |   4 +-
 .../src/pages/person/education/custom.tsx     |   5 +-
 .../src/pages/person/education/fields.tsx     |   2 +-
 mobile-ui/src/pages/person/education/form.tsx |   4 +-
 mobile-ui/src/pages/test/index.tsx            |   4 +-
 mobile-ui/src/utils/dynamicLoader.ts          | 108 ---
 274 files changed, 887 insertions(+), 19201 deletions(-)
 delete mode 100644 admin-pro-ui/.gitignore
 delete mode 100644 admin-pro-ui/README.md
 delete mode 100644 admin-pro-ui/__mocks__/axios.ts
 delete mode 100644 admin-pro-ui/__mocks__/fileMock.js
 delete mode 100644 admin-pro-ui/__mocks__/monaco-editor.js
 delete mode 100644 admin-pro-ui/jest.config.ts
 delete mode 100644 admin-pro-ui/mocks/index.js
 delete mode 100644 admin-pro-ui/mocks/product.js
 delete mode 100644 admin-pro-ui/mocks/user.js
 delete mode 100644 admin-pro-ui/package.json
 delete mode 100644 admin-pro-ui/public/favicon.ico
 delete mode 100644 admin-pro-ui/public/index.html
 delete mode 100644 admin-pro-ui/public/logo.png
 delete mode 100644 admin-pro-ui/react-jest.md
 delete mode 100644 admin-pro-ui/scripts/.gitignore
 delete mode 100644 admin-pro-ui/scripts/deploy.sh
 delete mode 100644 admin-pro-ui/scripts/docker-compose.yaml
 delete mode 100644 admin-pro-ui/scripts/install.sh
 delete mode 100644 admin-pro-ui/scripts/package.sh
 delete mode 100644 admin-pro-ui/src/api/account.ts
 delete mode 100644 admin-pro-ui/src/api/flow.ts
 delete mode 100644 admin-pro-ui/src/api/index.ts
 delete mode 100644 admin-pro-ui/src/api/jar.ts
 delete mode 100644 admin-pro-ui/src/api/leave.ts
 delete mode 100644 admin-pro-ui/src/api/node.ts
 delete mode 100644 admin-pro-ui/src/api/salary.ts
 delete mode 100644 admin-pro-ui/src/api/typings.d.ts
 delete mode 100644 admin-pro-ui/src/api/user.ts
 delete mode 100644 admin-pro-ui/src/api/validate.ts
 delete mode 100644 admin-pro-ui/src/assets/logo.svg
 delete mode 100644 admin-pro-ui/src/config/menus.tsx
 delete mode 100644 admin-pro-ui/src/config/register.component.tsx
 delete mode 100644 admin-pro-ui/src/config/theme.tsx
 delete mode 100644 admin-pro-ui/src/declarations.d.ts
 delete mode 100644 admin-pro-ui/src/framework/DynamicLoad/DynamicCode.tsx
 delete mode 100644 admin-pro-ui/src/framework/DynamicLoad/PageLoader.tsx
 delete mode 100644 admin-pro-ui/src/framework/Permission/Access/index.tsx
 delete mode 100644 admin-pro-ui/src/framework/Permission/AccessProvider/handler.ts
 delete mode 100644 admin-pro-ui/src/framework/Permission/AccessProvider/index.tsx
 delete mode 100644 admin-pro-ui/src/framework/Permission/RoleKeyProvider/RoleKeyManager.ts
 delete mode 100644 admin-pro-ui/src/framework/Permission/RoleKeyProvider/index.tsx
 delete mode 100644 admin-pro-ui/src/framework/Routes/MenuRouteManager.tsx
 delete mode 100644 admin-pro-ui/src/framework/Routes/RoutesProvider.tsx
 delete mode 100644 admin-pro-ui/src/index.scss
 delete mode 100644 admin-pro-ui/src/index.tsx
 delete mode 100644 admin-pro-ui/src/jest.setup.ts
 delete mode 100644 admin-pro-ui/src/layout/index.scss
 delete mode 100644 admin-pro-ui/src/layout/index.tsx
 delete mode 100644 admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
 delete mode 100644 admin-pro-ui/src/pages/flow/leave/index.tsx
 delete mode 100644 admin-pro-ui/src/pages/flow/record/index.scss
 delete mode 100644 admin-pro-ui/src/pages/flow/record/index.tsx
 delete mode 100644 admin-pro-ui/src/pages/flow/user/index.tsx
 delete mode 100644 admin-pro-ui/src/pages/flow/user/select.tsx
 delete mode 100644 admin-pro-ui/src/pages/flow/work/index.tsx
 delete mode 100644 admin-pro-ui/src/pages/flow/work/select.tsx
 delete mode 100644 admin-pro-ui/src/pages/form/index.tsx
 delete mode 100644 admin-pro-ui/src/pages/login/index.tsx
 delete mode 100644 admin-pro-ui/src/pages/welcome/index.scss
 delete mode 100644 admin-pro-ui/src/pages/welcome/index.tsx
 delete mode 100644 admin-pro-ui/src/react-app-env.d.ts
 delete mode 100644 admin-pro-ui/src/reportWebVitals.ts
 delete mode 100644 admin-pro-ui/src/store/CounterSlice.ts
 delete mode 100644 admin-pro-ui/src/store/MenuSlice.ts
 delete mode 100644 admin-pro-ui/src/store/Redux.tsx
 delete mode 100644 admin-pro-ui/src/utils/RoleControl.ts
 delete mode 100644 admin-pro-ui/src/utils/base64.ts
 delete mode 100644 admin-pro-ui/src/utils/dynamicLoader.ts
 delete mode 100644 admin-pro-ui/src/utils/index.ts
 delete mode 100644 admin-pro-ui/tsconfig.json
 delete mode 100644 admin-pro-ui/webpack.common.js
 delete mode 100644 admin-pro-ui/webpack.config.dev.js
 delete mode 100644 admin-pro-ui/webpack.config.mock.js
 delete mode 100644 admin-pro-ui/webpack.config.prod.js
 rename {admin-pro-ui => admin-ui}/public/captcha.jpeg (100%)
 rename {admin-pro-ui => admin-ui}/src/api/oss.ts (100%)
 delete mode 100644 admin-ui/src/components/CodeEditor/index.tsx
 delete mode 100644 admin-ui/src/components/Flow/components/PostponedFormView.tsx
 delete mode 100644 admin-ui/src/components/Flow/components/ResultFormView.tsx
 delete mode 100644 admin-ui/src/components/Flow/components/UserSelectView.tsx
 delete mode 100644 admin-ui/src/components/Flow/flow/FlowButtons.tsx
 delete mode 100644 admin-ui/src/components/Flow/flow/FlowChart.scss
 delete mode 100644 admin-ui/src/components/Flow/flow/FlowChart.tsx
 delete mode 100644 admin-ui/src/components/Flow/flow/FlowDetail.tsx
 delete mode 100644 admin-ui/src/components/Flow/flow/FlowHistory.tsx
 delete mode 100644 admin-ui/src/components/Flow/flow/FlowHistoryLine.scss
 delete mode 100644 admin-ui/src/components/Flow/flow/FlowHistoryLine.tsx
 delete mode 100644 admin-ui/src/components/Flow/flow/FlowTabs.tsx
 delete mode 100644 admin-ui/src/components/Flow/flow/FlowTitle.tsx
 delete mode 100644 admin-ui/src/components/Flow/flow/data.ts
 delete mode 100644 admin-ui/src/components/Flow/flow/events.tsx
 delete mode 100644 admin-ui/src/components/Flow/flow/index.scss
 delete mode 100644 admin-ui/src/components/Flow/flow/index.tsx
 delete mode 100644 admin-ui/src/components/Flow/flow/types.ts
 delete mode 100644 admin-ui/src/components/Flow/index.scss
 delete mode 100644 admin-ui/src/components/Flow/index.tsx
 delete mode 100644 admin-ui/src/components/Flow/layout/ControlPanel.scss
 delete mode 100644 admin-ui/src/components/Flow/layout/ControlPanel.tsx
 delete mode 100644 admin-ui/src/components/Flow/layout/NodePanel.scss
 delete mode 100644 admin-ui/src/components/Flow/layout/NodePanel.tsx
 delete mode 100644 admin-ui/src/components/Flow/nodes/Circulate/index.scss
 delete mode 100644 admin-ui/src/components/Flow/nodes/Circulate/index.tsx
 delete mode 100644 admin-ui/src/components/Flow/nodes/Node/index.scss
 delete mode 100644 admin-ui/src/components/Flow/nodes/Node/index.tsx
 delete mode 100644 admin-ui/src/components/Flow/nodes/Over/index.scss
 delete mode 100644 admin-ui/src/components/Flow/nodes/Over/index.tsx
 delete mode 100644 admin-ui/src/components/Flow/nodes/Start/index.scss
 delete mode 100644 admin-ui/src/components/Flow/nodes/Start/index.tsx
 delete mode 100644 admin-ui/src/components/Flow/nodes/StateLabel.tsx
 delete mode 100644 admin-ui/src/components/Flow/nodes/states.ts
 delete mode 100644 admin-ui/src/components/Flow/panel/ButtonPanel.tsx
 delete mode 100644 admin-ui/src/components/Flow/panel/EdgePanel.tsx
 delete mode 100644 admin-ui/src/components/Flow/panel/NodePanel.tsx
 delete mode 100644 admin-ui/src/components/Flow/panel/ScriptModal.scss
 delete mode 100644 admin-ui/src/components/Flow/panel/ScriptModal.tsx
 delete mode 100644 admin-ui/src/components/Flow/panel/circulate.tsx
 delete mode 100644 admin-ui/src/components/Flow/panel/node.tsx
 delete mode 100644 admin-ui/src/components/Flow/panel/over.tsx
 delete mode 100644 admin-ui/src/components/Flow/panel/panel.types.ts
 delete mode 100644 admin-ui/src/components/Flow/panel/shortcuts.ts
 delete mode 100644 admin-ui/src/components/Flow/panel/start.tsx
 delete mode 100644 admin-ui/src/components/Flow/readme.md
 delete mode 100644 admin-ui/src/components/Flow/register/flow.register.tsx
 delete mode 100644 admin-ui/src/components/Flow/store/FlowSlice.ts
 delete mode 100644 admin-ui/src/components/Flow/utils/index.ts
 delete mode 100644 admin-ui/src/components/Flow/utils/script.ts
 delete mode 100644 admin-ui/src/components/Form/ProFormCode/index.tsx
 delete mode 100644 admin-ui/src/components/Form/ProFormIcons/index.tsx
 delete mode 100644 admin-ui/src/components/Form/ProFormUploader/index.tsx
 delete mode 100644 admin-ui/src/components/Layout/AvatarHeader/index.tsx
 delete mode 100644 admin-ui/src/components/Layout/HeaderAction/index.tsx
 delete mode 100644 admin-ui/src/components/Layout/HeaderDropdown/index.tsx
 delete mode 100644 admin-ui/src/components/Layout/Page/index.tsx
 delete mode 100644 admin-ui/src/components/View/MenuIcon/index.tsx
 rename {admin-pro-ui => admin-ui}/src/components/flow/PostponedFormView.tsx (100%)
 rename {admin-pro-ui => admin-ui}/src/components/flow/UserSelectView.tsx (100%)
 rename {admin-pro-ui => admin-ui}/src/components/flow/register.tsx (100%)
 rename {admin-pro-ui => admin-ui}/src/components/icons/index.tsx (100%)
 rename {admin-pro-ui => admin-ui}/src/config/variables.scss (100%)
 delete mode 100644 admin-ui/src/framework/ComponentBus/index.tsx
 delete mode 100644 admin-ui/src/framework/EventBus/index.ts
 rename {admin-pro-ui => admin-ui}/src/gateway/default/Header.tsx (100%)
 rename {admin-pro-ui => admin-ui}/src/gateway/index.tsx (100%)
 delete mode 100644 admin-ui/src/json/flow.json
 rename {admin-pro-ui => admin-ui}/src/layout/AvatarHeader/index.tsx (100%)
 rename {admin-pro-ui => admin-ui}/src/layout/HeaderAction/index.tsx (100%)
 rename {admin-pro-ui => admin-ui}/src/layout/HeaderDropdown/index.tsx (100%)
 rename {admin-pro-ui => admin-ui}/src/layout/NotFound/index.tsx (100%)
 delete mode 100644 admin-ui/src/layout/pages/Menu/index.scss
 delete mode 100644 admin-ui/src/layout/pages/Menu/index.tsx
 delete mode 100644 admin-ui/src/layout/pages/NotFound/index.tsx
 delete mode 100644 admin-ui/src/pages/dynamic/test1.tsx
 delete mode 100644 admin-ui/src/pages/dynamic/test2.tsx
 delete mode 100644 admin-ui/src/pages/flow/work/__test__/index.test.tsx
 delete mode 100644 admin-ui/src/pages/jar/index.tsx
 delete mode 100644 admin-ui/src/pages/menu/index.tsx
 rename {admin-pro-ui => admin-ui}/src/pages/mirco/index.tsx (100%)
 delete mode 100644 admin-ui/src/pages/node/index.tsx
 delete mode 100644 admin-ui/src/pages/portal/Draggable.tsx
 delete mode 100644 admin-ui/src/pages/portal/Droppable.tsx
 delete mode 100644 admin-ui/src/pages/portal/index.tsx
 delete mode 100644 admin-ui/src/pages/redux/test1.tsx
 delete mode 100644 admin-ui/src/pages/redux/test2.tsx
 delete mode 100644 admin-ui/src/pages/role/index.tsx
 delete mode 100644 admin-ui/src/pages/salary/compoments/AGTable.tsx
 delete mode 100644 admin-ui/src/pages/salary/compoments/SalaryTable1.tsx
 delete mode 100644 admin-ui/src/pages/salary/compoments/SalaryTable2.tsx
 delete mode 100644 admin-ui/src/pages/salary/data/table1.ts
 delete mode 100644 admin-ui/src/pages/salary/data/table2.ts
 delete mode 100644 admin-ui/src/pages/salary/index.tsx
 delete mode 100644 admin-ui/src/pages/salary/store/salary.ts
 delete mode 100644 admin-ui/src/pages/salary/types.ts
 delete mode 100644 admin-ui/src/pages/user/index.tsx
 delete mode 100644 admin-ui/src/pages/welcome/__test__/index.test.tsx
 delete mode 100644 admin-ui/src/pages/welcome/data.ts
 delete mode 100644 admin-ui/src/portal/index.tsx
 rename {admin-pro-ui => admin-ui}/src/utils/captcha.ts (100%)
 rename {admin-pro-ui => admin-ui}/src/utils/oss.ts (100%)
 rename {admin-pro-ui => admin-ui}/todo.md (100%)
 delete mode 100644 mobile-ui/src/components/descriptions/index.scss
 delete mode 100644 mobile-ui/src/components/descriptions/index.tsx
 rename mobile-ui/src/components/flow/{plugins => }/PostponedFormView.tsx (90%)
 rename mobile-ui/src/components/flow/{plugins => }/UserSelectFormView.tsx (90%)
 delete mode 100644 mobile-ui/src/components/flow/components/FlowChart.tsx
 delete mode 100644 mobile-ui/src/components/flow/components/FlowContent.tsx
 delete mode 100644 mobile-ui/src/components/flow/components/FlowFooter.tsx
 delete mode 100644 mobile-ui/src/components/flow/components/FlowForm404.tsx
 delete mode 100644 mobile-ui/src/components/flow/components/FlowFormOpinion.tsx
 delete mode 100644 mobile-ui/src/components/flow/components/FlowHistory.tsx
 delete mode 100644 mobile-ui/src/components/flow/components/FlowHistoryLine.tsx
 delete mode 100644 mobile-ui/src/components/flow/components/FlowOpinion.tsx
 delete mode 100644 mobile-ui/src/components/flow/components/FlowPage.tsx
 delete mode 100644 mobile-ui/src/components/flow/components/FlowRecord.tsx
 delete mode 100644 mobile-ui/src/components/flow/components/FlowResult.tsx
 delete mode 100644 mobile-ui/src/components/flow/domain/FlowButtonClickContext.ts
 delete mode 100644 mobile-ui/src/components/flow/domain/FlowEventContext.ts
 delete mode 100644 mobile-ui/src/components/flow/domain/FlowRecordContext.ts
 delete mode 100644 mobile-ui/src/components/flow/domain/FlowResultParser.ts
 delete mode 100644 mobile-ui/src/components/flow/domain/FlowStateContext.tsx
 delete mode 100644 mobile-ui/src/components/flow/domain/FlowTriggerContext.ts
 delete mode 100644 mobile-ui/src/components/flow/nodes/Circulate/index.scss
 delete mode 100644 mobile-ui/src/components/flow/nodes/Circulate/index.tsx
 delete mode 100644 mobile-ui/src/components/flow/nodes/Node/index.scss
 delete mode 100644 mobile-ui/src/components/flow/nodes/Node/index.tsx
 delete mode 100644 mobile-ui/src/components/flow/nodes/Over/index.scss
 delete mode 100644 mobile-ui/src/components/flow/nodes/Over/index.tsx
 delete mode 100644 mobile-ui/src/components/flow/nodes/Start/index.scss
 delete mode 100644 mobile-ui/src/components/flow/nodes/Start/index.tsx
 delete mode 100644 mobile-ui/src/components/flow/nodes/StateLabel.tsx
 delete mode 100644 mobile-ui/src/components/flow/nodes/states.ts
 create mode 100644 mobile-ui/src/components/flow/register.tsx
 delete mode 100644 mobile-ui/src/components/flow/register/index.tsx
 delete mode 100644 mobile-ui/src/components/flow/store/FlowSlice.ts
 delete mode 100644 mobile-ui/src/components/flow/types.ts
 delete mode 100644 mobile-ui/src/components/flow/view/index.scss
 delete mode 100644 mobile-ui/src/components/flow/view/index.tsx
 delete mode 100644 mobile-ui/src/components/form/captcha.tsx
 delete mode 100644 mobile-ui/src/components/form/cascader.tsx
 delete mode 100644 mobile-ui/src/components/form/checkbox.tsx
 delete mode 100644 mobile-ui/src/components/form/common.tsx
 delete mode 100644 mobile-ui/src/components/form/date.tsx
 delete mode 100644 mobile-ui/src/components/form/domain/FormInstance.tsx
 delete mode 100644 mobile-ui/src/components/form/factory.tsx
 delete mode 100644 mobile-ui/src/components/form/form.scss
 delete mode 100644 mobile-ui/src/components/form/index.tsx
 delete mode 100644 mobile-ui/src/components/form/input.tsx
 delete mode 100644 mobile-ui/src/components/form/listener.ts
 delete mode 100644 mobile-ui/src/components/form/password.tsx
 delete mode 100644 mobile-ui/src/components/form/radio.tsx
 delete mode 100644 mobile-ui/src/components/form/rate.tsx
 delete mode 100644 mobile-ui/src/components/form/select.tsx
 delete mode 100644 mobile-ui/src/components/form/selector.tsx
 delete mode 100644 mobile-ui/src/components/form/slider.tsx
 delete mode 100644 mobile-ui/src/components/form/stepper.tsx
 delete mode 100644 mobile-ui/src/components/form/switch.tsx
 delete mode 100644 mobile-ui/src/components/form/textarea.tsx
 delete mode 100644 mobile-ui/src/components/form/types.tsx
 delete mode 100644 mobile-ui/src/components/form/uploder.tsx
 delete mode 100644 mobile-ui/src/components/form/utils.ts
 delete mode 100644 mobile-ui/src/components/form/validate.ts
 delete mode 100644 mobile-ui/src/framework/ComponentBus/index.tsx
 delete mode 100644 mobile-ui/src/framework/EventBus/index.ts
 delete mode 100644 mobile-ui/src/utils/dynamicLoader.ts

diff --git a/admin-pro-ui/.gitignore b/admin-pro-ui/.gitignore
deleted file mode 100644
index f46b1022..00000000
--- a/admin-pro-ui/.gitignore
+++ /dev/null
@@ -1,28 +0,0 @@
-# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
-
-/.idea
-
-# dependencies
-/node_modules
-/.pnp
-.pnp.js
-
-# testing
-/coverage
-
-# production
-/build
-/dist
-
-# misc
-.DS_Store
-.env.local
-.env.development.local
-.env.test.local
-.env.production.local
-
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-yarn.lock
-
diff --git a/admin-pro-ui/README.md b/admin-pro-ui/README.md
deleted file mode 100644
index 7c2c8ab0..00000000
--- a/admin-pro-ui/README.md
+++ /dev/null
@@ -1,33 +0,0 @@
-# Admin-ui with Antd For Micro Frontends
-
-This is a simple React App with Webpack5 & Typescript.
-
-## Features
-1. Support Webpack 5 ModuleFederationPlugin for Micro Frontends
-2. Support Dynamic zip component loading
-3. Support Dynamic Routing & Dynamic Menu
-4. Support Axios for API calls
-5. Support Antd & Pro-Components UI Library
-6. Support Redux for State Management
-7. Support Mock Server for API Mocking
-8. Support Monaco Editor for Code Editor
-9. Support Access ControlPanel for Menu & Page Components
-
-## Running
-```shell
-yarn
-
-yarn start
-```
-## Build
-```shell
-yarn build
-```
-
-## Deploy
-```shell
-cd scripts
-sh package.sh
-sh deploy.sh
-```
-
diff --git a/admin-pro-ui/__mocks__/axios.ts b/admin-pro-ui/__mocks__/axios.ts
deleted file mode 100644
index b3d0f3d8..00000000
--- a/admin-pro-ui/__mocks__/axios.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-// __mocks__/axios.ts
-const mockAxios = {
-    create: jest.fn(() => ({
-        interceptors: {
-            request: {
-                use: jest.fn(),
-                eject: jest.fn()
-            },
-            response: {
-                use: jest.fn(),
-                eject: jest.fn()
-            }
-        },
-        get: jest.fn(),
-        post: jest.fn(),
-        put: jest.fn(),
-        delete: jest.fn(),
-        patch: jest.fn()
-    })),
-    interceptors: {
-        request: {
-            use: jest.fn(),
-            eject: jest.fn()
-        },
-        response: {
-            use: jest.fn(),
-            eject: jest.fn()
-        }
-    },
-    get: jest.fn(),
-    post: jest.fn(),
-    put: jest.fn(),
-    delete: jest.fn(),
-    patch: jest.fn()
-};
-
-export default mockAxios;
diff --git a/admin-pro-ui/__mocks__/fileMock.js b/admin-pro-ui/__mocks__/fileMock.js
deleted file mode 100644
index 86059f36..00000000
--- a/admin-pro-ui/__mocks__/fileMock.js
+++ /dev/null
@@ -1 +0,0 @@
-module.exports = 'test-file-stub';
diff --git a/admin-pro-ui/__mocks__/monaco-editor.js b/admin-pro-ui/__mocks__/monaco-editor.js
deleted file mode 100644
index 657ce693..00000000
--- a/admin-pro-ui/__mocks__/monaco-editor.js
+++ /dev/null
@@ -1,9 +0,0 @@
-module.exports = {
-    editor: {
-        create: jest.fn(() => ({
-            dispose: jest.fn(),
-            getValue: jest.fn(() => ''),
-            setValue: jest.fn(),
-        })),
-    },
-};
diff --git a/admin-pro-ui/jest.config.ts b/admin-pro-ui/jest.config.ts
deleted file mode 100644
index ad3ff041..00000000
--- a/admin-pro-ui/jest.config.ts
+++ /dev/null
@@ -1,41 +0,0 @@
-import type { Config } from 'jest';
-
-const config: Config = {
-    preset: 'ts-jest',
-    testEnvironment: 'jsdom',
-    transform: {
-        '^.+\\.(ts|tsx)$': ['ts-jest', {
-            useESM: true,
-        }],
-        '^.+\\.(js|jsx|mjs)$': ['babel-jest', {
-            presets: [
-                ['@babel/preset-env', {
-                    targets: {
-                        node: 'current',
-                    },
-                }],
-                '@babel/preset-react',
-                '@babel/preset-typescript'
-            ],
-        }],
-    },
-    moduleNameMapper: {
-        '^monaco-editor$': '<rootDir>/__mocks__/monaco-editor.js',
-        "@logicflow": "<rootDir>/node_modules/@logicflow/core/dist/index.min.js",
-        '\\.(css|less|scss|sass)$': 'identity-obj-proxy',
-        '\\.(jpg|jpeg|png|gif|webp|svg)$': '<rootDir>/__mocks__/fileMock.js',
-        '^@/(.*)$': '<rootDir>/src/$1'
-    },
-    setupFilesAfterEnv: ['<rootDir>/src/jest.setup.ts'],
-    testMatch: [
-        "**/__test__/**/*.[jt]s?(x)",
-        "**/__tests__/**/*.[jt]s?(x)",
-        "**/?(*.)+(spec|test).[jt]s?(x)"
-    ],
-    moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node'],
-    transformIgnorePatterns: [
-        'node_modules/(?!(lodash-es|@ant-design|@logicflow|other-esm-modules)/)'
-    ],
-};
-
-export default config;
diff --git a/admin-pro-ui/mocks/index.js b/admin-pro-ui/mocks/index.js
deleted file mode 100644
index b76c1b92..00000000
--- a/admin-pro-ui/mocks/index.js
+++ /dev/null
@@ -1,7 +0,0 @@
-const userMock = require('./user');
-const productMock = require('./product');
-
-module.exports = (app, helper) => {
-    userMock(app);
-    productMock(app);
-};
\ No newline at end of file
diff --git a/admin-pro-ui/mocks/product.js b/admin-pro-ui/mocks/product.js
deleted file mode 100644
index 92a4ddd6..00000000
--- a/admin-pro-ui/mocks/product.js
+++ /dev/null
@@ -1,16 +0,0 @@
-const Mock = require('mockjs');
-
-module.exports = (app, helper) => {
-    app.get('/api/products', (req, res) => {
-
-        const products = Mock.mock({
-            'list|100': [{
-                'id|+1': 1,
-                'name': '@name',
-                'price|100-1000': 1,
-            }]
-        }).list;
-
-        res.json(products);
-    });
-};
\ No newline at end of file
diff --git a/admin-pro-ui/mocks/user.js b/admin-pro-ui/mocks/user.js
deleted file mode 100644
index d8ef8b72..00000000
--- a/admin-pro-ui/mocks/user.js
+++ /dev/null
@@ -1,28 +0,0 @@
-module.exports = (app, helper) => {
-    app.post('/user/login', (req, res) => {
-        const username = req.body.username;
-
-        if(username==='admin'){
-            res.json({
-                success:true,
-                data:{
-                    'username': username,
-                    'token':'test token',
-                    'avatar':'/logo.png',
-                    'authorities': ['ROLE_ADMIN','ROLE_DEVELOPER'],
-                }
-            });
-            return;
-        }
-
-        res.json({
-            success:true,
-            data:{
-                'username': username,
-                'token':'test token',
-                'avatar':'/logo.png',
-                'authorities': ['ROLE_USER'],
-            }
-        });
-    });
-};
\ No newline at end of file
diff --git a/admin-pro-ui/package.json b/admin-pro-ui/package.json
deleted file mode 100644
index 7f33c151..00000000
--- a/admin-pro-ui/package.json
+++ /dev/null
@@ -1,98 +0,0 @@
-{
-  "name": "admin-pro-ui",
-  "version": "0.1.0",
-  "private": true,
-  "dependencies": {
-    "@ag-grid-community/locale": "^33.0.3",
-    "@ant-design/icons": "^5.4.0",
-    "@ant-design/pro-components": "^2.8.2",
-    "@babel/standalone": "^7.25.6",
-    "@codingapi/flow-pc": "^0.0.8",
-    "@codingapi/form-pc": "^0.0.16",
-    "@codingapi/ui-framework": "^0.0.12",
-    "@dnd-kit/core": "^6.2.0",
-    "@dnd-kit/sortable": "^9.0.0",
-    "@handsontable/react-wrapper": "^15.0.0",
-    "@logicflow/core": "^2.0.5",
-    "@logicflow/extension": "^2.0.9",
-    "@reduxjs/toolkit": "^2.2.7",
-    "@types/babel__standalone": "^7.1.7",
-    "@types/node": "^16.18.108",
-    "@types/react": "^18.3.5",
-    "@types/react-dom": "^18.3.0",
-    "ag-grid-react": "^33.0.3",
-    "antd": "^5.20.6",
-    "axios": "^1.7.7",
-    "base64-js": "^1.5.1",
-    "handsontable": "^15.0.0",
-    "jszip": "^3.10.1",
-    "lodash": "^4.17.21",
-    "moment": "^2.30.1",
-    "react": "^18.3.1",
-    "react-dom": "^18.3.1",
-    "react-markdown": "^10.0.0",
-    "react-redux": "^9.1.2",
-    "react-router": "^6.26.2",
-    "react-router-dom": "^6.26.2",
-    "remark-gfm": "^4.0.1",
-    "typescript": "^5.6.2",
-    "web-vitals": "^2.1.4"
-  },
-  "scripts": {
-    "start": "webpack serve --config webpack.config.mock.js --open",
-    "dev": "webpack serve --config webpack.config.dev.js --open",
-    "build": "webpack --mode production --config webpack.config.prod.js",
-    "test": "jest",
-    "test:watch": "jest --watchAll"
-  },
-  "eslintConfig": {
-    "extends": [
-      "react-app"
-    ]
-  },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
-  },
-  "devDependencies": {
-    "@babel/preset-env": "^7.26.0",
-    "@babel/preset-react": "^7.26.3",
-    "@babel/preset-typescript": "^7.26.0",
-    "@testing-library/dom": "^10.4.0",
-    "@testing-library/jest-dom": "^6.6.3",
-    "@testing-library/react": "^16.1.0",
-    "@types/jest": "^29.5.14",
-    "@types/lodash": "^4.17.7",
-    "@types/lodash-es": "^4.17.12",
-    "babel-jest": "^29.7.0",
-    "clean-webpack-plugin": "^4.0.0",
-    "copy-webpack-plugin": "^12.0.2",
-    "css-loader": "^7.1.2",
-    "express": "^4.21.0",
-    "html-webpack-plugin": "^5.6.0",
-    "identity-obj-proxy": "^3.0.0",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
-    "mockjs": "^1.1.0",
-    "monaco-editor-webpack-plugin": "^7.1.0",
-    "sass": "^1.78.0",
-    "sass-loader": "^16.0.1",
-    "style-loader": "^4.0.0",
-    "ts-jest": "^29.2.5",
-    "ts-loader": "^9.5.1",
-    "ts-node": "^10.9.2",
-    "webpack": "^5.94.0",
-    "webpack-cli": "^5.1.4",
-    "webpack-dev-server": "^5.1.0",
-    "webpack-merge": "^6.0.1",
-    "webpack-mock-server": "^1.0.21"
-  }
-}
diff --git a/admin-pro-ui/public/favicon.ico b/admin-pro-ui/public/favicon.ico
deleted file mode 100644
index a11777cc471a4344702741ab1c8a588998b1311a..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 3870
zcma);c{J4h9>;%nil|2-o+rCuEF-(I%-F}ijC~o(k~HKAkr0)!FCj~d>`RtpD?8b;
zXOC1OD!V*IsqUwzbMF1)-gEDD=A573Z-&G7^LoAC9|WO7Xc0Cx1g^Zu0u_SjAPB<A
z`RksU20=ur5rmib*S!+l%h4eS4)^Q+0X>3vGa^W|sj)80f#V0@M_CAZTIO(t--xg=
z!sii`1giyH7EKL_+Wi0ab<)&E_0KD!3Rp2^HNB*K2@PHCs4PWSA32*-^7d{9nH2_E
zmC{C*N*)(vEF1_aMamw2A{ZH5aIDqiabnFdJ|y0%aS|64E$`s2ccV~3lR!u<){eS`
z#^Mx6o(iP1Ix%<jZ{9b!^*}EvPeMb_W#+3mPDk@<s^Oh#VM&a2^K;|820}`)peR}+
zJXt@j)V#7+Js?u;Lb#g$HH)e~Ro^hvl6KSLHq)Y3adj<OOD7?;gwee^gNzCxwD?IA
z8?*}E@b*IiVPUPv3?XqzLRv|{4)GKGzjS`)#ukL7W&K6BHn&1}P(skc69cJ?5^C+V
z@yyqLJg;V2Ul%gZ*?2WiB%bNfz1}F^UeTpW^N?dSY@NL3zDD+Tzk$Cg_=cj!M^ot0
zu%qYEoTU9K@kMP2H52_@<2On}lNX!oZ(oWk^?eSfXAa3M8S?8tzISV2V&9A+_-47Y
z>4dv`t@!&Za-K@mTm#vadc{0aWDV*_%EiGK7qMC_(`exc>-$Gb9~W!w_^{*pYRm~G
zBN{nA<l~YIv(*f3@JAyAZDXwp4d;meFk*lN;rx5VQze6aK!n?W9`Uc4pES2K&V3BC
zkTJK{PcIXdQ?hM;i7~K{wRSeU-w9_32aC}+7nN6r5o<=I@CyjQAS~;jsb7p#@eUT2
zkh1M~1>;cm^w$VWg1O^^<6vY`1XCD|s_zv*g*5&V#wv&s#h$xlUilPe4U@I&UXZbL
z0)%9Uj&@yd03n;!7do+bfixH^FeZ-Ema}s;DQX2gY+7g0s(9;`8GyvPY1*vxiF&|w
z>!vA~GA<~JUqH}d;DfBSi^IT*#lrzXl$fNpq0_T1tA+`A$1?(gLb?e#0>UELvljtQ
zK+*74m0jn&)5yk8mLBv;=@}c{t0ztT<<S2g5CX`xuBQVwYJOMIsv7paOX6ypYJL$a
zJ|Vy}#?V4i+kjXzBq)LcuJEA=z^Z2W4WQ1U@0}*!;_q<!3_ls8PhMM3ii*Ci+cF6=
zF!@E<x#%Yvb!P0>v;Avck$S6D`Z)^c0(jiwKhQsn|LDRY&w(Fmi91I7H6S;b0XM{e
zXp0~(T@k_r-!jkLwd1_Vre^v$G4|kh4}=Gi?$AaJ)3I+^m|Zyj#*?Kp@w(lQdJZf4
z#|IJW5z+S^e9@(6hW6N~{pj8|NO*>1)E=%?nNUAkmv~OY&ZV<PHdt%yO<W_%O|c-T
zC%nAvgv?#h>;m-%?pQ_11)hAr0oAwILrlsGawpxx4D43J&K=n+p3WLnlDsQ$b(9+4
z?mO^hmV^F8MV{4<aA#E-8o{y-by8hR1>Lx>(Q=aHhQ1){0d*(e&s%G=i5rq3;t{JC
zmgbn5Nkl)t@fPH$v;af26lyhH!k+#}_&aBK4baYPbZy$5aFx4}ka<ge$nBI}>&qxl
z$=Rh$W;U)>-=S-0=?7FH9dUAd2(q#4TCAHky!$^~;Dz^j|8_wuKc*YzfdA<NJp8x7
z`_}_7!m44CG`<6nLk0r3A}8e>ht@Q&ror?91Dm!N03=4=O!a)I*0q~p0g$Fm$pmr$
zb;wD;STDIi$@M%y1>p&_>%?UP($15gou_ue1u0!4(%81;qcIW8NyxFEvXpiJ|H4wz
z*mFT(qVx1FKufG11hByuX%lPk4t#WZ{>8ka2efjY`~;AL6vWyQKpJun2nRiZYDij$
zP>4jQXPaP$UC$yIVgGa)jDV;F0l^n(V=HMRB5)20V7&r$<L^Phf(W29K>jmk{UUIe
zVjKroK}JAbD>B`2cwNQ&GDLx8{pg`7hbA~grk|W6LgiZ`8y`{Iq0i>t!3p2}MS6S+
zO_ruKyAElt)rdS>CtF7j{&6rP-#c=7evGMt7B6`7HG|-(WL`bDUAjyn+k$mx$C<FS
ztTQ#rrhaxTX7@2TN#`pson<p6thk-4?N)^;_(Up!_V=f}<~kR)zD%o0iiqseIMZqh
zGU`kZGbN)qs{;AuZP?~%PajDo&b&7)!V!+|VO<ediN}{)OvR~sQ<ZYe%O|)8-DTKw
zTXmYP$VLa(Y>H;q2Dz4x;cPP$hW=`pFfLO)!jaCL@V2+F)So3}vg|%O*^T1j>C2lx
zsURO-zIJC$^$g2byVbRIo^w>UxK}74^TqUiRR#7s_X$e)$6iYG1(PcW7un-va-S&u
zHk9-6Zn&>T==A)lM^D~bk{&rFzCi35>UR!ZjQkdSiNX*-;l4z9j*7|q`TBl~Au`5&
z+c)*8?#-tgUR$Zd%Q3bs96w6k7q@#tUn`5rj+r@_sAVVLqco|6O{ILX&U-&-cbVa3
zY?ngHR@%l{;`ri%H*0EhBWrGjv!LE4db?HEWb5mu*t@{kv|XwK8?npOshmzf=vZA@
zVSN9sL~!sn?r(AK)Q7Jk2(|M67Uy3I{eRy<vjA)m;~)jV3DFGzL)eNbs@Sy80roD>
z_l&Y@A>;vjkWN5I2xvFFTLX0i+`{qz7C_@bo`ZUzDugfq4+>a3?1v%)O+YTd6@Ul7
zAfLfm=nhZ`)P~&v90$&UcF+yXm9sq!qCx3^9gzIcO|Y(js^Fj)Rvq>nQAHI92ap=P
z10A4@prk+<s7nQxb0&o?puD0BStB$NLIA{pVg<pW;2=HJ11ZpVkRkF89w0s#3ef?(
zka>AGWCb`2)dQYFuR$|H6iDE8p}9a?#nV2}LBCoCf(Xi2@szia7#gY>b|l!-U`c}@
zLdhvQjc!BdLJvYvzzzngnw51yRYCqh4}$oRCy-z|v3Hc*d|?^Wj=l~18*E~*cR_kU
z{XsxM1i{V*4GujHQ3DBpl2w4FgFR48Nma@HPgnyKoIEY-MqmMeY=I<%oG~l!f<+FN
z1ZY^;10j4M4<Vo=b&OyEfF!Y);yDCJas8bbVhK~blk}<IGME~h)6n~gdmqP>#HYXP
zw5eJpA_y(>uLQ~OucgxDLuf}fVs272FaMxhn4xnDGIyLXnw>Xsd^J8XhcWIwIoQ9}
z%FoSJTAGW(SRGwJwb=@pY7r$uQRK3Zd~XbxU)ts!4XsJrCycrWSI?e!IqwqIR8+Jh
zlRjZ`UO1I!BtJR_2~7AbkbSm%XQqxEPkz6BTGWx8e}nQ=w7bZ|eVP4?*Tb!$(R)iC
z9)&%bS*u(lXqzitAN)Oo=&Ytn>%Hzjc<5liuPi>zC_nw;Z0AE3Y$Jao_Q90R-gl~5
z_xAb2J%eArrC1CN4G$}-zVvCqF1;H;abAu6G*+PDHSYFx@Tdbfox*uEd3}BUyYY-l
zTfEsOqsi#f9^FoLO;ChK<554qkri&Av~SIM*{fEYRE?vH7pTAOmu2pz3X?Wn*!ROX
ztd54huAk&mFBemMooL33RV-*1f0Q3_(7hl$<#*|WF9P!;r;4_+X~k~uKEqdzZ$5Al
zV63X<s4EnR@itBNL^suG_KHV!zgrw6&Bq&`dNv>N<k2!6lBSoSAvQBw$a}{Sg*d5f
zJqeF6lxH}v-(s5jl(8V8Bv*((#aw(*iLTd8#?8FnMLG#}AorDTkK*%$ni#S{e-*jA
zjy$_xALPmR?$A)F?XdsKy|!Ue+lIR5=csS!ZPu7h{Nc+Sd%?*WHR`S5ByDdhQAsNO
zeyx0!D+fx-a_t<57fQ^<7*WTVDog0}WA0F2_h++_I?f`i|C>@)j$FN#cCD;ek1R#l
zv%pGrhB~KWgoCj%GT?%{@@o(AJGt*PG#l3i>lhmb_twKH^EYvacVY-6bsCl5*^~L0
zonm@lk2UvvTKr2RS%}T>^~EYqdL1q4nD%0n&Xqr^cK^`J5W;lRRB^R-O<zOhVxo?8
zb#fjP=~|*nH<rZsU&F20QcP*BR|)$r#sFFtYi6hV=2&f<YJ%JC0IAdIRdHjO(;S%3
zC;L{EqcHO368@u|<ql>8b&HENO||mo0xaD+S=I8RTlIfVgqN@SXDr2&-)we--K7w=
zJVU8?Z+7k9dy;s;^gDkQa`0nz6N{T?(A&Iz)2!DEecLyRa&FI!id#5Z7B*O2=PsR0
zEvc|8{NS^)!d)MDX(97Xw}m&kEO@5jqRaDZ!+%`wYOI<23q|&js`&o4xvjP7D_xv@
z5hEwpsp{HezI9!~6O{~)lLR@oF7?J7i>1|5a~UuoN=q&6N}EJPV_GD`&M*v8Y`^2j
zKII*d_@Fi$+i*YEW+Hbz<W=zs^XxM$!;??OHDS{MUEdOi9{rF;;#a0RO>n{iQk~yP
z>7N{S4)r*!NwQ`(qcN#8SRQsNK6>{)X12nbF`*7#ecO7I)Q$uZsV+xS4E7aUn+U(K
baj7?x%VD!5Cxk2YbYLNVeiXvvpMCWYo=by@

diff --git a/admin-pro-ui/public/index.html b/admin-pro-ui/public/index.html
deleted file mode 100644
index 12f184e0..00000000
--- a/admin-pro-ui/public/index.html
+++ /dev/null
@@ -1,36 +0,0 @@
-<!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" />
-    <meta
-      name="description"
-      content="Web site created using create-react-app"
-    />
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
-    <title>Admin-Pro UI</title>
-  </head>
-  <body>
-    <noscript>You need to enable JavaScript to run this app.</noscript>
-    <div id="root"></div>
-    <!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
-  </body>
-</html>
diff --git a/admin-pro-ui/public/logo.png b/admin-pro-ui/public/logo.png
deleted file mode 100644
index fc44b0a3796c0e0a64c3d858ca038bd4570465d9..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 5347
zcmZWtbyO6NvR-oO24RV%BvuJ&=?+<7=`LvyB&A_#M7mSDYw1v6DJkiYl9X<guIKOG
zci*|^ymP*p?>jT!%$dLEBTQ8R9|wd3008in6lFF3GV-6mLi?MoP_y~}QUnaDCHI#t
z7w^m$@6DI)|C8_jrT?q=f8D?0AM?L)Z}xAo^e^W>t$*Y0KlT5=@bBjT9k<?nGGBhQ
zSbehEe6l@wQk?yk{Pz@AcMVld0M;GTCE?4p`2*7=c-2|99C89m^UO&?Z>xb%-KNdk
zeOS1tKO#ChhG7%{ApNBzE2ZVNcxbrin#E1TiAw#BlUhXllzhN$qWez5l;h<YdrI9P
zS<6GhD3leYXm+LY=TY4I>+t^q#Eav8PhR2|T}y5kkflaK`ba-eoE+Z2q@o6P$)=&`
z+(8}+-McnNO>e#$Rr{32ngsZIAX>GH??tqgwUuUz6kjns|LjsB37zUEWd|(&O!)DY
zQLrq%Y>)Y8G`yYbYCx&aVHi@-vZ3|ebG!f$sTQqMgi0hWRJ^Wc+Ibv!udh_r%2|U)
zPi|E^PK?UE!>_4`f`1k4hqqj_$+d!EB_#IYt;f9)fBOumGNyglU(ofY`yHq4Y?B%-
zp&G!MRY<~ajTgIHErMe(Z8JG*;D-PJhd@RX@QatggM7+G(Lz8eZ;73)72Hfx5KDOE
zkT(m}i2;@X2AT5fW?qVp?@WgN$aT+f_6eo?IsLh;jscNRp|8H}Z9p_UBO^SJXpZew
zEK8fz|0Th%(Wr|KZBGTM4yxkA5CFdAj8=QSrT$fKW#tweUFqr0TZ9D<AY0)k`aBx_
z>~a5lF{)%-tTGMK^2tz(y2v$i%V8XAxIywrZCp=)83p(zIk6@S5AWl|Oa2hF`~~^W
zI;KeOSkw1O#TiQ8;U7OPXjZM|KrnN}9arP)m0v$c|L)lF`j_rpG(zW1Qjv$=^|p*f
z>)Na{D&>n`jOWMwB^TM}slgTEcjxTlUby89j1)|6ydRfWERn3|7Zd2&e7?!K&5G$x
z`5U3uFtn4~SZq|LjFVrz$3iln-+ucY4q$BC{CSm7Xe5c1J<=%Oagztj{ifpaZk_bQ
z9Sb-LaQMKp-qJA*bP6DzgE3`}*i1o3GKmo2pn@dj0;He}F=BgINo};6gQF8!n0ULZ
zL>kC0nPSFzlcB7p4<H52f8=qMn2=dQ!;xXD`6jdiBJ2^oNyt+16A(f<i;0;6ddGE;
zQ_@XTca6wSK(vK5KIKHUgO;P>1doao2F7%6IUTi_+!L`MM4o*#Y#0v~WiO8<L#fHx
zI?x?k(&T-}!n%}LcF+uCp*>uSeAUNp=vA2KaR&=jNR2iVwG>7t%sG2x_~yXzY)7K&
zk3p+O0AFZ1eu^T3s};B<g5t4vVJN7*?kWOGhv$ru8HW)vzo*&RaaqNEl3s?|)YGKH
zo63kVeX8eiiI8)8TVI<9KtqUE{ofuaw7$nnPUt#2l$=IC;iDij;8{QXU+uLWA9c~M
z?KiTNfE|~IwacG?sFBRbqY&vgc~Yaopzd0{Lg`-WSBW2a@&8=tG<r`Ob?)2siT;lG
zPzbHtt{(VS9*a_>%6TpJ6h-Y%B^*zT&SN7C=N;g|#dGIVMSOru3iv^SvO>h4<o1)Q
ztk-z{yw|{Hc59vTba3&#6I)4@Z!Z{_&vNhxwseBQJk-micCb@PRsZ-yUF*D=BME?9
zv0H77d40W7BL-#9+(qd9=V7!I>M=t-N1GSLLDqVTcgurco6)3&XpU!FP6Hlrmj}f$
zp95;b)>M~`kxuZF3r~a!rMf4|&1=uMG$;h^g=Kl;H&Np-(pFT9FF@++MMEx3R<rS-
zuB^adWYC5}jnG`RBeLHUV`KdbUu)vW8p$<wk-gJklNpkTMH8;qgxUtn=hQw+aXu!!
z7L<V8=#FBERK(Iy;KSCGArNoBxI|R+%WaYJr`}%uyfu_sJ6N4<E%!ST6&8KTNUgT0
zc=|z>BsK?AU0fPk-#mdR)Wdkj)`>ZMl#^<80kM87VvsI3r_c@_vX=fdQ`_9-d(xiI
z4K;1y1TiPj_RPh*SpDI7U~^QQ?%0&!$Sh#?x_@;ag)P}ZkAik{_WPB4rHyW#%>|Gs
zdbhyt=qQPA7`?h2_8T;-E6HI#im9K>au*(j4;kzwMSLgo6u*}-K`$_Gzgu&XE)udQ
zmQ72^eZd|vzI)~!20JV-v-T|<4@7ruqrj|o4=JJPlybwMg;M$Ud7>h6g()CT@wXm`
zbq=A(t;RJ^{Xxi*Ff~!|3!-l_PS{AyNAU~t{h;(N(PXMEf^R<?TfDfq&c>(B+ZVX3
z8y0;0A8hJYp@g+c*`>eTA|3Tgv9U8#BDTO9@a@gVMDxr(fVaEqL1tl?md{v^j8aUv
zm&%PX4^|<cvLF*HzSDMGV0iHPD$KT$lv#8;LIw%pD|^3Sh^Dv=f=y*RKZlzMkH(pA
zj!TBU#${|io0kf9sBt#c(IUh^Nw?i5pPmkQDL8Jo`ihi{POC*hzPF#9gJ%+*%r~)G
z*hzHaRQu;^GSmtSWXj1<&y{<D%B-d(ca1<IOKZoU>rX|?E4^CkplWWNv*OKM>DxPa
z!RJ)U^0-WJMi)Ksc!^ixOtw^egoAZZ2Cg;X7(5xZG7yL_;UJ#yp*ZD-;I^Z9qkP`}
zwCTs0*%rIVF1sgLervtnUo&brwz?6?PXRuOCS*JI-WL6GKy7-~yi0giTEMmDs_-UX
zo=+nFrW_EfTg>oY72_4Z0*uG>MnXP=c0VpT&*|rvv1i<G)%__T#O;}Vf68{=uDg!&
z$^|uGJ##zrX6I7v^ea{ysV}DJ_zrf_yt8+T?W6jw=&>StW;*^={rP<Gps5k_;Ey{*
zO|;e5vGXQ@h1vJKGQ+`NMmYBKV~Sx1US+h>1y?Hv+6R6bxFMkxpWkJ>m7Ba{>zc_q
zEefC3jsXdyS5??Mz7IET$Kft|EMNJIv7Ny8ZOcKnzf`K5Cd)&`-fTY#W&jnV0l2vt
z?Gqhic}l}mCv1yUEy$%DP}4AN;36$=7aNI^*AzV(eYGeJ(Px-j<^gSDp5dBAv2#?;
zcM<nu%TB#lev5kX<apfcKZZ%hDDU3kXtK*%;R839$alV38VWT{NJnhjF0GL`9rM2k
zVexf3KgbIO)>Xv#aj>%;MiG^q^$0MSg-(uTl!xm49dH!{X0){Ew7ThWV~Gtj7h%ZD
zVN-R-^7Cf0VH!8O)uUHPL2mO2tmE*cecwQv_5CzWeh)ykX8r5Hi`ehYo)d{Jnh&3p
z9ndXT$OW51#H5cFKa76c<%nNkP~<gM?)^OX$gL^Ky|we;1(h|2M#l;#h2Tj`PPB<E
z!n=Eb`hcI+66~)eT{SBi;R$mV2KtH}>FU93b5h-|Cb}ScHs@4Q#|}byWg;KDMJ#|l
zE=MKD<?0c>*F@HDBcX@~QJH%56eh~jfPO-uKm}~t7Vk<jf*+P>HxHT;)4sd+?Wc4*
z>CyR*{w@4(gnYRdFq=^(#-ytb^5ESD?x<0Skhb%Pt?npNW1m+Nv`tr9+qN<3H1f<%
zZvNEqyK5F<KUONUP{U|Z&`@-OcU{=Mb%iZGj^d}>gPsQ`QIu9P0x_}wJR~^CotL|n
zk?dn;tLRw9jJTur4uWoX6iMm914f0AJfB@C74a;_qRrAP4E7l890P&{v<}>_&GLrW
z)klculcg`?zJO~4;BBAa=POU%aN|pmZJn2{hA!d!*lwO%YSIzv8bTJ}=nhC^n<w3-
z-v~(ZP6zhLQOa--Vj)F~k0Ob}euB(Y8{v*v$;WjNYg|Cj9;VkDLv+N+V{aW7CW=3<
z$l$KzIhY7gI#*j8`VKQqt@ea1=E#0c5IVICnVAH{bp_LL1iIVw*Itgfi#Sq7_Q<98
zA1cq2BqF{g9$p1@&gq>}g(ld^rn#kq9Z3)z`k9lvV>y#!F4e{5c$tnr9M{V)0m(Z<
z#88vX6-AW7T2UUwW`g<;8I$Jb!R%z@rCcGT)-2k7&x9kZZT66}Ztid~6t0jKb&9mm
zpa}LCb`bz`{MzpZR#E*QuBiZXI#<`5qxx=&LMr-UUf~@dRk}YI2hbMsAMWOmDzYtm
zjof16D=mc`^B$+_bCG$$@R0t;e?~UkF?7<(vkb70*EQB1rfUWXh$j)R2)+dNAH5%R
zEBs^?N;UMdy}V};59Gu#0$q53$}|+q7CIGg_w_WlvE}AdqoS<7DY1LWS9?TrfmcvT
zaypmplwn=P4;a8-%l^e?f`OpGb}%(_mFsL&GywhyN(-VROj`4~V~9bGv%UhcA|YW%
zs{;nh@aDX11y^HOF<O&mcM-|{L00A>XB$a7#Sr3cEtNd4eLm@Y#fc&j)TGvbbMwze
zXtekX_wJqxe4NhuW$r}cNy|L{V=t#$%SuWEW)YZTH|!iT79k#?632OFse{+BT_gau
zJwQcbH{b}dzKO?^dV&3nTILYlGw{27UJ72ZN){BILd_HV_s$WfI2DC<9LIHFmtyw?
zQ;?MuK7g%Ym+4e^W#5}WDLpko%jPOC=aN)3!=8)s#Rnercak&b3ESRX3z{xfKBF8L
z5%CGkFmGO@x?_mPGlpEej!3!AMddChabyf~nJNZxx!D&{@xEb!TDyvqSj%Y5@A{}9
zRzoBn0?x}=krh{ok3Nn%e)#~uh;6jpezhA)ySb^b#E>73e*frBFu6IZ^D7Ii&rsiU
z%jzygxT-n*joJpY4o&8UXr2s%j^Q{?e-<G_^{J76Mq?|eHl2Q}TIfLz1H}I9fvS=c
zm*oIlbD9$tAnOWfM^xYqm2?aavV7kSFN~t(hX*&jXwdT)(-yUc1(^4$bB@D*Rg4fF
zGv*BCBqRz8`^LRBWj98zY@aQ`B||0ovS-9b;m0T<TXj-Hh5;G|U%0o&CSKp)@EmW@
zChzrZU(8@!L%c_f>voloX`4DQyEK+DmrZh8A$)<mmOk^JRtKa)h*12TXYBu6*SOO3
ze#NvXs$UpPLNJLqoTpKTRV%K2qK9}L;hCtucS=cqUWJH}3K=Em3K@4&JHx{iSFa8E
zqVHD4$k0g3oTIYd{?wVF<(2=uTWaH@w6)NT<>iWL#NO9+Y@!sO2f@rI!@jN@>HOA<
z?q2l{^%mY*PNx2FoX+A7X3N}(RV$B`g&N=e0uvAvEN1W^{*W?zT1i#fxuw10%~))J
zjx#gxoVlXREWZf4hRkgdHx5V_S*;p-y%JtGgQ4}lnA~MBz-AFdxUxU1RIT$`sal|X
zPB6sEVRjGbXIP0U+?rT|y5+ev&OMX*5C$n2SBPZr`jqzrmpVrNciR0e*Wm?fK6DY&
zl(XQZ60yWXV-|Ps!A<n+?vbcQJG{k7=<p3~`+h4Kd_>{EF;=_z(YAF=T(-MkJXUoX
zI{UMQDAV2}Ya?EisdEW;@pE6dt;j0fg5oT2dxCi{wqWJ<)|SR6fxX~5CzblPGr8cb
zUBVJ2CQd~3L?7yfTpLNbt)He1D>*KXI^GK%<`bq^cUq$Q@uJifG>p3LU(!H=C)aEL
zenk7pVg}0{dKU}&l)Y2Y2eFMdS(<j~2+yHkUVn{?C5dsJXag$OUKP&Vl2lSAJL_uI
ztevY_DRGdi^2bgn=Ll@Km6Uk>JS0}oZUuVaf2+K*YFNGHB`^YGcIpnBlMhO7d4@vV
zv(@N}(k#REdul8~fP+^F@ky*wt@~&|(&&meNO>rKDEnB{ykAZ}k>e@lad7to>Ao$B
zz<1(L=#J*u4_LB=8w+*{KFK^u00NAmeNN7pr+Pf+N*Zl^dO{LM-hMHyP6N!~`24jd
zXYP|Ze;dRXKdF2iJG$U{k=S86l@pytLx}$JFFs8e)*Vi?aVBtGJ3JZUj!~c{<R$n(
ziv;4$OAR*24{KJ-u{Mz2C%|m?Lu8%akP2m-8t9?^hJ};KWux0$T6Zc6vmNj_(P^97
znxN8^Fl+G8f)9)fW?Qt`NcWoFLaagnygy3@TZ@Gu-ER?^vZ;^CT6NUUf@sIN!o*#I
zTQDxUq9IS<Y5j7ng8Y<xvPo+D=~nKpr2LflB|zg+Vlqg|&Z#IWz8CdW!h`-uDggJR
z+f9qRnZ^{3x$+Kifl~IZh)$X4>(rw5>vuRF$`^p!P8w1B=O!skwkO5yd4_XuG^QVF
z`-r5K7(IPSiKQ2|U9+`@Js!<HL1C{aO{H=}S{3p}_Edej>g6sfJwAHVd|s?|mnC*q
zp|B|z)(8+mxXyxQ{8Pg3F4|tdpgZZSoU4P&9I8)nHo1@)9_9u&NcT^FI)6|hsAZFk
zZ+arl&@*>RXBf-OZxhZerOr&dN5LW9@gV=oGFbK*J+m#R-|e6(Loz(;g@T^*oO)0R
zN`N=X46b{7yk5FZGr#5&n1!-@j@g02g|X>MOpF3#IjZ_4wg{dX+G9eqS+Es9@6nC7
zD9$NuVJI}6ZlwtUm5cCAiYv0(Yi{%eH+}t)!E^>^KxB5^L~a`4%1~5q6h>d;paC9c
zTj0wTCKrhWf+F#5>EgX<cLYfrtsHC5;@&1Tu=KIwHE|R;*1f&W24i_&2yx+Xe5N7V
z`hmH?m*G_>`sl%POl?oyCq0(w0xoL?L%)|Q7d|Hl92rUYAU#lc**I&^6p=4lNQPa0
znQ|A~i0ip@`B=FW-Q;zh?-wF;Wl5!+q3GXDu-x&}$gUO)NoO7^$BeEIrd~1Dh{Tr`
z8s<(Bn@gZ(mkIGnmYh_ehXnq78QL$pNDi)|QcT*|GtS%nz1uKE+E{7jdEBp%h0}%r
zD2|KmYGiPa4;md-t_m5YDz#c*oV_FqXd85d@eub?9N61QuYcb3CnVWpM(D-^|CmkL
z(F}L&N7qhL2PCq)fRh}XO@U`Yn<<Z#)X^Ij=#WjXr&snbL8Hbkya6{c!+Ay;w1Jlr
z9}X^@zhtUU>?TNGR4L(mF7#4u29{i~@k;pLsgl({YW5`Mo+p=zZn3L*4{JU;++dG9
X@eDJUQo;Ye2mwlRs<JiGX2Jghdw)}T

diff --git a/admin-pro-ui/react-jest.md b/admin-pro-ui/react-jest.md
deleted file mode 100644
index 84debe86..00000000
--- a/admin-pro-ui/react-jest.md
+++ /dev/null
@@ -1,190 +0,0 @@
-# React Unit Test for Jest
-
-1. dependencies on devDependencies  
-```
-@testing-library/dom  
-@testing-library/jest-dom
-@testing-library/react
-@types/jest
-jest
-ts-jest
-jest-environment-jsdom
-identity-obj-proxy
-ts-node
-```
-2. add jest.config.ts and add jest script in package.json
-
-```
-//rootDir/jest.config.ts
-import type { Config } from 'jest';
-
-const config: Config = {
-    preset: 'ts-jest',
-    testEnvironment: 'jsdom',
-    transform: {
-        '^.+\\.(ts|tsx)$': 'ts-jest',
-        '^.+\\.(js|jsx)$': 'babel-jest',
-    },
-    moduleNameMapper: {
-        '\\.(css|less|scss|sass)$': 'identity-obj-proxy',
-        '\\.(jpg|jpeg|png|gif|webp|svg)$': '<rootDir>/__mocks__/fileMock.js',
-        '^@/(.*)$': '<rootDir>/src/$1'
-    },
-    setupFilesAfterEnv: ['<rootDir>/src/jest.setup.ts'],
-    testRegex: '(/__tests__/.*|(\\.|/)(test|spec))\\.(jsx?|tsx?)$',
-    moduleFileExtensions: ['ts', 'tsx', 'js', 'jsx', 'json', 'node']
-};
-
-export default config;
-
-
-```
-
-on jest.config.ts will setting up the jest configuration for the project.
-some important configuration is moduleNameMapper, this setting configuration for style,asset,and project path alias.
-setupFilesAfterEnv is the file that will be executed before the test run, in this case jest.setup.ts
-testRegex is regex for the test file, in this case the test file should be end with .test.tsx or .spec.tsx
-
-
-on `package.json` add jest script
-```
-"scripts":{
-    "test": "jest",
-    "test:watch": "jest --watch"
-    ... other scripts
-}
-```
-
-3. add jest.setup.ts and fileMock.js in src folder
-```
-// rootDir/src/jest.setup.ts
-import '@testing-library/jest-dom';
-```
-
-```
-
-// rootDir/__mocks__/fileMock.js
-module.exports = 'test-file-stub';
-
-```
-
-4. create test file in src folder, example my component file in `rootDir/src/pages/welcome/index.tsx` then the test file should be in `rootDir/src/pages/welcome/__tests__/index.test.tsx`
-```
-
-import React from 'react';
-import Welcome from '../index';
-import {render} from "@testing-library/react";
-import store from "@/store/Redux";
-import {Provider} from "react-redux";
-
-// test description for the component
-describe('Welcome Component', () => {
-    // test case for the component
-    test('renders with default initial value', () => {
-        // render the component
-        render(
-            <Provider store={store}>
-                <Welcome />
-            </Provider>
-        );
-        // get the element that will be tested
-        const countElement = document.querySelector('.App-header p');
-        // assert the element is exist
-        expect(countElement).toBeInTheDocument();
-        // assert the element text content
-        expect(countElement).toHaveTextContent('hi , Redux counter: 0, Roles:');
-        // log the element text content
-        console.log(countElement?.textContent);
-    });
-});
-
-```
-
-5. test router component
-
-> specify the router path in the test file
-```
-import { render, fireEvent } from '@testing-library/react';
-import { MemoryRouter, Routes, Route } from 'react-router-dom';
-import UserProfile from '../UserProfile';
-
-describe('UserProfile Component', () => {
-  test('renders user profile with correct ID', () => {
-  
-    //  use memory router and setting initial router path
-    const { getByTestId } = render(
-      <MemoryRouter initialEntries={['/user/123']}>
-        <Routes>
-          <Route path="/user/:id" element={<UserProfile />} />
-        </Routes>
-      </MemoryRouter>
-    );
-
-    expect(getByTestId('user-id')).toHaveTextContent('User ID: 123');
-  });
-});
-```
-> or use `BrowserRouter` and `render` function
-```
-import { render, fireEvent } from '@testing-library/react';
-import { createMemoryHistory } from 'history';
-import { Router } from 'react-router-dom';
-import App from '../App';
-
-describe('App Navigation', () => {
-  test('full app navigation', () => {
-    const history = createMemoryHistory();
-    const { getByText } = render(
-      <Router location={history.location} navigator={history}>
-        <App />
-      </Router>
-    );
-    fireEvent.click(getByText('Go to Profile'));
-    expect(history.location.pathname).toBe('/profile');
-  });
-});
-```
-
-6. test axios api calling
-```
-
-import { render, waitFor } from '@testing-library/react';
-import axios from 'axios';
-import { UserProfile } from '../UserProfile';
-
-jest.mock('axios');
-const mockedAxios = axios as jest.Mocked<typeof axios>;
-
-describe('UserProfile Component', () => {
-  // test case for the component
-  test('loads all user data correctly - URL based', async () => {
-    // mock the axios get function
-    mockedAxios.get.mockImplementation((url) => {
-      if (url === '/api/users/123') {
-        return Promise.resolve({
-          data: { name: 'John Doe', email: 'john@example.com' }
-        });
-      }
-      if (url === '/api/users/123/posts') {
-        return Promise.resolve({
-          data: [{ id: 1, title: 'Post 1' }]
-        });
-      }
-      if (url === '/api/users/123/followers') {
-        return Promise.resolve({
-          data: [{ id: 1, name: 'Follower 1' }]
-        });
-      }
-      return Promise.reject(new Error('Not found'));
-    });
-
-    const { getByTestId } = render(<UserProfile userId="123" />);
-
-    await waitFor(() => {
-      expect(getByTestId('user-info')).toHaveTextContent('John Doe');
-      expect(getByTestId('user-posts')).toHaveTextContent('Post 1');
-      expect(getByTestId('user-followers')).toHaveTextContent('Follower 1');
-    });
-  });
-  
-```
diff --git a/admin-pro-ui/scripts/.gitignore b/admin-pro-ui/scripts/.gitignore
deleted file mode 100644
index 3f20b3b8..00000000
--- a/admin-pro-ui/scripts/.gitignore
+++ /dev/null
@@ -1 +0,0 @@
-/admin
diff --git a/admin-pro-ui/scripts/deploy.sh b/admin-pro-ui/scripts/deploy.sh
deleted file mode 100644
index b9802e2f..00000000
--- a/admin-pro-ui/scripts/deploy.sh
+++ /dev/null
@@ -1,8 +0,0 @@
-serverHost=server
-serverAccount=root
-serverPort=22
-serverPath=/opt/test/
-
-
-scp -o ConnectTimeout=30 -P $serverPort  -r * $serverAccount@$serverHost:$serverPath
-ssh -p $serverPort $serverAccount@$serverHost "cd $serverPath && sed -i 's/\r//g' *.sh && sh install.sh"
diff --git a/admin-pro-ui/scripts/docker-compose.yaml b/admin-pro-ui/scripts/docker-compose.yaml
deleted file mode 100644
index d4d678cc..00000000
--- a/admin-pro-ui/scripts/docker-compose.yaml
+++ /dev/null
@@ -1,12 +0,0 @@
-version: "3"
-
-services:
-  admin-nginx:
-    image: nginx:latest
-    volumes:
-      - "./admin:/usr/share/nginx/html"
-    environment:
-      TZ: "Asia/Shanghai"
-    restart: always
-    ports:
-      - "13000:80"
\ No newline at end of file
diff --git a/admin-pro-ui/scripts/install.sh b/admin-pro-ui/scripts/install.sh
deleted file mode 100644
index 3032008a..00000000
--- a/admin-pro-ui/scripts/install.sh
+++ /dev/null
@@ -1,3 +0,0 @@
-docker-compose build --no-cache
-docker-compose up -d
-docker ps -a
\ No newline at end of file
diff --git a/admin-pro-ui/scripts/package.sh b/admin-pro-ui/scripts/package.sh
deleted file mode 100644
index aebf879d..00000000
--- a/admin-pro-ui/scripts/package.sh
+++ /dev/null
@@ -1,8 +0,0 @@
-rm -rf admin
-
-cd ..
-yarn
-yarn run build
-
-
-cp -r ./dist/ ./scripts/admin/
\ No newline at end of file
diff --git a/admin-pro-ui/src/api/account.ts b/admin-pro-ui/src/api/account.ts
deleted file mode 100644
index d2efb1ec..00000000
--- a/admin-pro-ui/src/api/account.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import {get, post} from "@/api/index";
-
-export async function login(body: Account.LoginRequest) {
-    return post('/user/login', body);
-}
-
-export async function captcha() {
-    return get('/open/captcha');
-}
-
-
-export function clearUser() {
-    localStorage.removeItem('username');
-    localStorage.removeItem('token');
-    localStorage.removeItem('authorities');
-    localStorage.removeItem('avatar');
-}
-
-export function initUser(user: {
-    username: string;
-    token: string;
-    authorities: string[];
-    avatar: string;
-}) {
-    const {username, token, authorities, avatar} = user;
-    localStorage.setItem('username', username);
-    localStorage.setItem('token', token);
-    if(authorities) {
-        localStorage.setItem('authorities', JSON.stringify(authorities));
-    }
-    localStorage.setItem('avatar', avatar || "/logo.png");
-}
diff --git a/admin-pro-ui/src/api/flow.ts b/admin-pro-ui/src/api/flow.ts
deleted file mode 100644
index 5837490e..00000000
--- a/admin-pro-ui/src/api/flow.ts
+++ /dev/null
@@ -1,165 +0,0 @@
-import {get, page, post} from "@/api/index";
-
-
-// 流程设计
-
-export async function list(
-    params: any,
-    sort: any,
-    filter: any,
-    match: {
-        key: string,
-        type: string
-    }[]
-) {
-    return page('/api/query/flowWork/list', params, sort, filter, match);
-}
-
-
-export async function save(body: any) {
-    return post('/api/cmd/flowWork/save', body);
-}
-
-export async function copy(id: any) {
-    return post('/api/cmd/flowWork/copy', {id});
-}
-
-export async function remove(id: any) {
-    return post('/api/cmd/flowWork/delete', {id});
-}
-
-export async function changeState(id: any) {
-    return post('/api/cmd/flowWork/changeState', {id});
-}
-
-export async function schema(body: any) {
-    return post('/api/cmd/flowWork/schema', body);
-}
-
-// 流程控制
-
-export async function startFlow(body:any) {
-    return post('/api/cmd/flowRecord/startFlow', body);
-}
-
-export async function getFlowStep(body:any) {
-    return post('/api/cmd/flowRecord/getFlowStep', body);
-}
-
-export async function removeFlow(body:any) {
-    return post('/api/cmd/flowRecord/remove', body);
-}
-
-
-export async function detail(id?:any,workCode?:any) {
-    return get('/api/query/flowRecord/detail', {id,workCode});
-}
-
-export async function saveFlow(body:any) {
-    return post('/api/cmd/flowRecord/save', body);
-}
-
-export async function submitFlow(body:any) {
-    return post('/api/cmd/flowRecord/submitFlow', body);
-}
-
-export async function trySubmitFlow(body:any) {
-    return post('/api/cmd/flowRecord/trySubmitFlow', body);
-}
-
-export async function custom(body:any) {
-    return post('/api/cmd/flowRecord/custom', body);
-}
-
-export async function recall(body:any) {
-    return post('/api/cmd/flowRecord/recall', body);
-}
-
-export async function postponed(body:any) {
-    return post('/api/cmd/flowRecord/postponed', body);
-}
-
-export async function transfer(body:any) {
-    return post('/api/cmd/flowRecord/transfer', body);
-}
-
-export async function urge(body:any) {
-    return post('/api/cmd/flowRecord/urge', body);
-}
-
-
-// 待办中心控制
-
-export async function flowRecordList(params: any,
-                                     sort: any,
-                                     filter: any,
-                                     match: {
-                                         key: string,
-                                         type: string
-                                     }[]) {
-    return page('/api/query/flowRecord/list', params, sort, filter, match);
-}
-
-
-export async function findAllByOperatorId(params: any,
-                                     sort: any,
-                                     filter: any,
-                                     match: {
-                                         key: string,
-                                         type: string
-                                     }[]) {
-    return page('/api/query/flowRecord/findAllByOperatorId', params, sort, filter, match);
-}
-
-
-export async function findTodoByOperatorId(params: any,
-                                     sort: any,
-                                     filter: any,
-                                     match: {
-                                         key: string,
-                                         type: string
-                                     }[]) {
-    return page('/api/query/flowRecord/findTodoByOperatorId', params, sort, filter, match);
-}
-
-export async function findDoneByOperatorId(params: any,
-                                           sort: any,
-                                           filter: any,
-                                           match: {
-                                               key: string,
-                                               type: string
-                                           }[]) {
-    return page('/api/query/flowRecord/findDoneByOperatorId', params, sort, filter, match);
-}
-
-
-export async function findInitiatedByOperatorId(params: any,
-                                           sort: any,
-                                           filter: any,
-                                           match: {
-                                               key: string,
-                                               type: string
-                                           }[]) {
-    return page('/api/query/flowRecord/findInitiatedByOperatorId', params, sort, filter, match);
-}
-
-
-export async function findTimeoutTodoByOperatorId(params: any,
-                                                sort: any,
-                                                filter: any,
-                                                match: {
-                                                    key: string,
-                                                    type: string
-                                                }[]) {
-    return page('/api/query/flowRecord/findTimeoutTodoByOperatorId', params, sort, filter, match);
-}
-
-export async function findPostponedTodoByOperatorId(params: any,
-                                                  sort: any,
-                                                  filter: any,
-                                                  match: {
-                                                      key: string,
-                                                      type: string
-                                                  }[]) {
-    return page('/api/query/flowRecord/findPostponedTodoByOperatorId', params, sort, filter, match);
-}
diff --git a/admin-pro-ui/src/api/index.ts b/admin-pro-ui/src/api/index.ts
deleted file mode 100644
index 2488e68c..00000000
--- a/admin-pro-ui/src/api/index.ts
+++ /dev/null
@@ -1,124 +0,0 @@
-import axios from "axios";
-import {sleep, textToBase64} from "@/utils";
-import {message} from "antd";
-
-const api = axios.create({
-    timeout: 10000,
-    headers: {
-        "Content-Type": "application/json",
-    },
-});
-
-api.interceptors.request.use((config: any) => {
-    const token = localStorage.getItem("token");
-    if (token) {
-        config.headers = {
-            Authorization: `${token}`,
-        } as any;
-    }
-    return config;
-}, (error: any) => {
-    return Promise.reject(error);
-});
-
-api.interceptors.response.use(async (response: any) => {
-        const headers = response.headers;
-        const token = headers['authorization'];
-
-        const state = response.status;
-        if (state === 200) {
-            if (token) {
-                console.log('reset token', token);
-                localStorage.setItem("token", token)
-            }
-
-            if(response.data) {
-                const success = response.data.success;
-                if (!success) {
-                    const errMessage = response.data.errMessage;
-                    const errCode = response.data.errCode;
-                    if ("token.expire" === errCode || "token.error" === errCode) {
-                        message.error('登录已过期，请退出再重新打开');
-                        await sleep(1500);
-                        localStorage.clear();
-                        window.location.href = '/#login';
-                    } else {
-                        if ("login.error" === errCode) {
-                            return response;
-                        }
-                        message.error(errMessage)
-                    }
-                }
-            }else {
-                message.error('抱歉，该账户无权限访问');
-            }
-        }
-        return response;
-    },
-    (error: any) => {
-        const response = error.response;
-        const state = response.data.status;
-
-        if(state === 403){
-            message.error('抱歉，该账户无权限访问').then();
-            return {
-                data: {
-                    success: false,
-                }
-            }
-        }
-        return Promise.reject(error);
-    }
-)
-
-
-export const get = async (url: string, params?: any) => {
-    try {
-        const response = await api.get(url, {
-            params
-        });
-        return response.data;
-    }catch (e){
-        return {
-            success: false,
-        }
-    }
-}
-
-export const post = async (url: string, data: any) => {
-    try {
-        const response = await api.post(url, data);
-        return response.data;
-    }catch (e){
-        return {
-            success: false,
-        }
-    }
-}
-
-export const page = async (url: string, params: any, sort: any, filter: any, match: {
-    key: string,
-    type: string
-}[]) => {
-    const response = await get(url, {
-        ...params,
-        sort: textToBase64(sort),
-        filter: textToBase64(filter),
-        params: textToBase64(match),
-    });
-
-    if(response.success){
-        const list = response.data.total > 0 ? response.data.list : [];
-        return {
-            data: list,
-            success: response.success,
-            total: response.data.total
-        };
-    }else{
-        return {
-            data: [],
-            success: response.success,
-            total: 0
-        }
-    }
-}
diff --git a/admin-pro-ui/src/api/jar.ts b/admin-pro-ui/src/api/jar.ts
deleted file mode 100644
index 873517dd..00000000
--- a/admin-pro-ui/src/api/jar.ts
+++ /dev/null
@@ -1,9 +0,0 @@
-import {post} from "@/api/index";
-
-export async function upload(body: any) {
-    return post('/api/jar/upload', body);
-}
-
-export async function restart() {
-    return post('/api/jar/restart',{});
-}
diff --git a/admin-pro-ui/src/api/leave.ts b/admin-pro-ui/src/api/leave.ts
deleted file mode 100644
index 5c22bc7f..00000000
--- a/admin-pro-ui/src/api/leave.ts
+++ /dev/null
@@ -1,20 +0,0 @@
-import {page, post} from "@/api/index";
-
-export async function list(
-    params: any,
-    sort: any,
-    filter: any,
-    match: {
-        key: string,
-        type: string
-    }[]
-) {
-    return page('/api/query/leave/list', params, sort, filter, match);
-}
-
-
-
-export async function startLeave(body: any) {
-    return post('/api/cmd/leave/startLeave', body);
-}
-
diff --git a/admin-pro-ui/src/api/node.ts b/admin-pro-ui/src/api/node.ts
deleted file mode 100644
index 9c62d9c6..00000000
--- a/admin-pro-ui/src/api/node.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-import {page, post} from "@/api/index";
-
-export async function list(
-    params: any,
-    sort: any,
-    filter: any,
-    match: {
-        key: string,
-        type: string
-    }[]
-) {
-    return page('/api/node/list', params, sort, filter, match);
-}
-
-
-export async function save(body: any) {
-    return post('/api/node/save', body);
-}
-
-
-export async function del(body: {
-    id: string,
-}) {
-    return post('/api/node/delete', body);
-}
diff --git a/admin-pro-ui/src/api/salary.ts b/admin-pro-ui/src/api/salary.ts
deleted file mode 100644
index 928ae139..00000000
--- a/admin-pro-ui/src/api/salary.ts
+++ /dev/null
@@ -1,10 +0,0 @@
-export const users = async () => {
-    const data = [];
-    for(let i=0;i<500;i++){
-        data.push({
-            id:i,
-            name:`张三${i}`
-        });
-    }
-    return data
-}
diff --git a/admin-pro-ui/src/api/typings.d.ts b/admin-pro-ui/src/api/typings.d.ts
deleted file mode 100644
index 05b40d16..00000000
--- a/admin-pro-ui/src/api/typings.d.ts
+++ /dev/null
@@ -1,37 +0,0 @@
-// @ts-ignore
-/* eslint-disable */
-
-declare namespace API {
-  type CurrentUser = {
-    username?: string;
-    authorities?: string[];
-    avatar?: string;
-  };
-
-  type Response<T> = {
-    status: string;
-    success: boolean;
-    errCode: string;
-    errMessage: string;
-    data: T;
-  }
-
-}
-
-
-declare namespace Account {
-
-  type LoginResponse = {
-    token: string;
-    username: string;
-    authorities: string[];
-  };
-
-
-  type LoginRequest = {
-    username?: string;
-    password?: string;
-    type?: string;
-  };
-}
-
diff --git a/admin-pro-ui/src/api/user.ts b/admin-pro-ui/src/api/user.ts
deleted file mode 100644
index 08d3ac4e..00000000
--- a/admin-pro-ui/src/api/user.ts
+++ /dev/null
@@ -1,40 +0,0 @@
-import {page, post,get} from "@/api/index";
-
-export async function list(
-    params: any,
-    sort: any,
-    filter: any,
-    match: {
-        key: string,
-        type: string
-    }[]
-) {
-    return page('/api/query/user/list', params, sort, filter, match);
-}
-
-export async function users() {
-    return get('/api/query/user/list', {current:1,pageSize:999999});
-}
-
-
-export async function save(body: any) {
-    return post('/api/cmd/user/save', body);
-}
-
-export async function entrust(body: any) {
-    return post('/api/cmd/user/entrust', body);
-}
-
-export async function removeEntrust(id: any) {
-    return post('/api/cmd/user/removeEntrust', {id});
-}
-
-
-export async function changeManager(id: any) {
-    return post('/api/cmd/user/changeManager', {id});
-}
-
-
-export async function remove(id: any) {
-    return post('/api/cmd/user/remove', {id});
-}
diff --git a/admin-pro-ui/src/api/validate.ts b/admin-pro-ui/src/api/validate.ts
deleted file mode 100644
index d40f32f0..00000000
--- a/admin-pro-ui/src/api/validate.ts
+++ /dev/null
@@ -1,103 +0,0 @@
-import {FormInstance} from "antd/es/form/hooks/useForm";
-import {NamePath} from "rc-field-form/es/interface";
-
-// 流程表单API 提供get post的能力
-export interface FlowFormApi {
-    get: (url: string, params?: any) => Promise<any>;
-    post: (url: string, data: any) => Promise<any>;
-}
-
-// 流程表单验证内容
-export class FlowFormValidateContent {
-    readonly value: any;
-    readonly form: FormInstance;
-    readonly api?: FlowFormApi
-
-    constructor(value: any, form: FormInstance, api?: FlowFormApi) {
-        this.value = value;
-        this.form = form;
-        this.api = api;
-    }
-}
-
-// 自定义验证
-export interface FlowFormCustomValidate {
-    name: NamePath;
-    validate: (content: FlowFormValidateContent) => Promise<string[]>;
-}
-
-// 流程表单API上下文
-export class FlowFormApiContext {
-
-    private static readonly instance: FlowFormApiContext = new FlowFormApiContext();
-
-    private api: FlowFormApi | undefined;
-
-    private constructor() {
-        this.api = undefined;
-    }
-
-    public static getInstance() {
-        return FlowFormApiContext.instance;
-    }
-
-    public setApi(api: FlowFormApi) {
-        this.api = api;
-    }
-
-    public getApi() {
-        return this.api;
-    }
-}
-
-// 自定义验证上下文
-export class FlowFormCustomValidateContext {
-
-    private readonly map: Map<NamePath, FlowFormCustomValidate>;
-
-    constructor() {
-        this.map = new Map();
-    }
-
-    public addValidate(validate: FlowFormCustomValidate) {
-        this.map.set(validate.name, validate);
-    }
-
-    public addCustomFunctionCodeValidate(namePath:NamePath,validateFuncCode:string){
-        const validateFunc = new Function('content', validateFuncCode);
-        this.addValidate({
-            name: namePath,
-            validate: async (content) => {
-                return validateFunc(content);
-            }
-        });
-    }
-
-    public validate(form: FormInstance) {
-        this.map.values().forEach((validate) => {
-            const value = form.getFieldValue(validate.name);
-            const content = new FlowFormValidateContent(value, form, FlowFormApiContext.getInstance().getApi());
-            validate.validate(content).then((res) => {
-                form.setFields(
-                    [
-                        {
-                            name: validate.name,
-                            errors: res,
-                        }
-                    ]
-                )
-            }).catch((error) => {
-                form.setFields(
-                    [
-                        {
-                            name: validate.name,
-                            errors: [error],
-                        }
-                    ]
-                )
-            });
-        });
-    }
-}
-
-
diff --git a/admin-pro-ui/src/assets/logo.svg b/admin-pro-ui/src/assets/logo.svg
deleted file mode 100644
index 9dfc1c05..00000000
--- a/admin-pro-ui/src/assets/logo.svg
+++ /dev/null
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 841.9 595.3"><g fill="#61DAFB"><path d="M666.3 296.5c0-32.5-40.7-63.3-103.1-82.4 14.4-63.6 8-114.2-20.2-130.4-6.5-3.8-14.1-5.6-22.4-5.6v22.3c4.6 0 8.3.9 11.4 2.6 13.6 7.8 19.5 37.5 14.9 75.7-1.1 9.4-2.9 19.3-5.1 29.4-19.6-4.8-41-8.5-63.5-10.9-13.5-18.5-27.5-35.3-41.6-50 32.6-30.3 63.2-46.9 84-46.9V78c-27.5 0-63.5 19.6-99.9 53.6-36.4-33.8-72.4-53.2-99.9-53.2v22.3c20.7 0 51.4 16.5 84 46.6-14 14.7-28 31.4-41.3 49.9-22.6 2.4-44 6.1-63.6 11-2.3-10-4-19.7-5.2-29-4.7-38.2 1.1-67.9 14.6-75.8 3-1.8 6.9-2.6 11.5-2.6V78.5c-8.4 0-16 1.8-22.6 5.6-28.1 16.2-34.4 66.7-19.9 130.1-62.2 19.2-102.7 49.9-102.7 82.3 0 32.5 40.7 63.3 103.1 82.4-14.4 63.6-8 114.2 20.2 130.4 6.5 3.8 14.1 5.6 22.5 5.6 27.5 0 63.5-19.6 99.9-53.6 36.4 33.8 72.4 53.2 99.9 53.2 8.4 0 16-1.8 22.6-5.6 28.1-16.2 34.4-66.7 19.9-130.1 62-19.1 102.5-49.9 102.5-82.3zm-130.2-66.7c-3.7 12.9-8.3 26.2-13.5 39.5-4.1-8-8.4-16-13.1-24-4.6-8-9.5-15.8-14.4-23.4 14.2 2.1 27.9 4.7 41 7.9zm-45.8 106.5c-7.8 13.5-15.8 26.3-24.1 38.2-14.9 1.3-30 2-45.2 2-15.1 0-30.2-.7-45-1.9-8.3-11.9-16.4-24.6-24.2-38-7.6-13.1-14.5-26.4-20.8-39.8 6.2-13.4 13.2-26.8 20.7-39.9 7.8-13.5 15.8-26.3 24.1-38.2 14.9-1.3 30-2 45.2-2 15.1 0 30.2.7 45 1.9 8.3 11.9 16.4 24.6 24.2 38 7.6 13.1 14.5 26.4 20.8 39.8-6.3 13.4-13.2 26.8-20.7 39.9zm32.3-13c5.4 13.4 10 26.8 13.8 39.8-13.1 3.2-26.9 5.9-41.2 8 4.9-7.7 9.8-15.6 14.4-23.7 4.6-8 8.9-16.1 13-24.1zM421.2 430c-9.3-9.6-18.6-20.3-27.8-32 9 .4 18.2.7 27.5.7 9.4 0 18.7-.2 27.8-.7-9 11.7-18.3 22.4-27.5 32zm-74.4-58.9c-14.2-2.1-27.9-4.7-41-7.9 3.7-12.9 8.3-26.2 13.5-39.5 4.1 8 8.4 16 13.1 24 4.7 8 9.5 15.8 14.4 23.4zM420.7 163c9.3 9.6 18.6 20.3 27.8 32-9-.4-18.2-.7-27.5-.7-9.4 0-18.7.2-27.8.7 9-11.7 18.3-22.4 27.5-32zm-74 58.9c-4.9 7.7-9.8 15.6-14.4 23.7-4.6 8-8.9 16-13 24-5.4-13.4-10-26.8-13.8-39.8 13.1-3.1 26.9-5.8 41.2-7.9zm-90.5 125.2c-35.4-15.1-58.3-34.9-58.3-50.6 0-15.7 22.9-35.6 58.3-50.6 8.6-3.7 18-7 27.7-10.1 5.7 19.6 13.2 40 22.5 60.9-9.2 20.8-16.6 41.1-22.2 60.6-9.9-3.1-19.3-6.5-28-10.2zM310 490c-13.6-7.8-19.5-37.5-14.9-75.7 1.1-9.4 2.9-19.3 5.1-29.4 19.6 4.8 41 8.5 63.5 10.9 13.5 18.5 27.5 35.3 41.6 50-32.6 30.3-63.2 46.9-84 46.9-4.5-.1-8.3-1-11.3-2.7zm237.2-76.2c4.7 38.2-1.1 67.9-14.6 75.8-3 1.8-6.9 2.6-11.5 2.6-20.7 0-51.4-16.5-84-46.6 14-14.7 28-31.4 41.3-49.9 22.6-2.4 44-6.1 63.6-11 2.3 10.1 4.1 19.8 5.2 29.1zm38.5-66.7c-8.6 3.7-18 7-27.7 10.1-5.7-19.6-13.2-40-22.5-60.9 9.2-20.8 16.6-41.1 22.2-60.6 9.9 3.1 19.3 6.5 28.1 10.2 35.4 15.1 58.3 34.9 58.3 50.6-.1 15.7-23 35.6-58.4 50.6zM320.8 78.4z"/><circle cx="420.9" cy="296.5" r="45.7"/><path d="M520.5 78.1z"/></g></svg>
\ No newline at end of file
diff --git a/admin-pro-ui/src/config/menus.tsx b/admin-pro-ui/src/config/menus.tsx
deleted file mode 100644
index a5dfd64c..00000000
--- a/admin-pro-ui/src/config/menus.tsx
+++ /dev/null
@@ -1,59 +0,0 @@
-import React from "react";
-import Login from "@/pages/login";
-
-export const routes = [
-    {
-        path: '/login',
-        element: <Login/>,
-    },
-]
-
-export const menus = [
-    {
-        path: '/welcome',
-        name: '欢迎',
-        icon: "SmileOutlined",
-        page: 'welcome',
-    },
-    {
-        path: '/form',
-        name: '表单',
-        icon: "FormOutlined",
-        page: 'form',
-    },
-    {
-        path: '/mirco',
-        name: '微前端',
-        icon: "FormOutlined",
-        page: 'mirco',
-    },
-    {
-        path: '/flow',
-        name: '流程',
-        icon: "CiOutlined",
-        routes: [
-            {
-                path: '/flow/work',
-                name: '流程管理',
-                page: 'flow/work',
-            },
-            {
-                path: '/flow/record',
-                name: '办理中心',
-                page: 'flow/record',
-            },
-            {
-                path: '/flow/leave',
-                name: '请假管理',
-                page: 'flow/leave',
-            },
-            {
-                path: '/flow/user',
-                name: '流程用户',
-                page: 'flow/user',
-            },
-        ]
-    },
-]
-
-
diff --git a/admin-pro-ui/src/config/register.component.tsx b/admin-pro-ui/src/config/register.component.tsx
deleted file mode 100644
index a996c631..00000000
--- a/admin-pro-ui/src/config/register.component.tsx
+++ /dev/null
@@ -1 +0,0 @@
-import "@/components/flow/register";
diff --git a/admin-pro-ui/src/config/theme.tsx b/admin-pro-ui/src/config/theme.tsx
deleted file mode 100644
index 2cfb113c..00000000
--- a/admin-pro-ui/src/config/theme.tsx
+++ /dev/null
@@ -1,28 +0,0 @@
-import {ThemeConfig} from "antd";
-
-export const theme = {
-    token: {
-        colorPrimary: '#4a79d8',
-    }
-} as ThemeConfig;
-
-
-export const config = {
-    // 主题配置
-    theme: theme,
-    // 后台名称
-    title: 'Admin UI',
-    // 后台logo
-    logo: '/logo.png',
-    // 欢迎页路径
-    welcomePath: '/welcome',
-    // 登录页路径
-    loginPath: '/login',
-    // 侧边栏宽度
-    siderWidth: 216,
-    // 侧边栏布局
-    layout: 'mix' as 'side' | 'top' | 'mix',
-    // 水印
-    waterMark: 'default waterMark',
-}
-
diff --git a/admin-pro-ui/src/declarations.d.ts b/admin-pro-ui/src/declarations.d.ts
deleted file mode 100644
index 09760663..00000000
--- a/admin-pro-ui/src/declarations.d.ts
+++ /dev/null
@@ -1,4 +0,0 @@
-declare module '*.svg' {
-    const content: any;
-    export default content;
-}
\ No newline at end of file
diff --git a/admin-pro-ui/src/framework/DynamicLoad/DynamicCode.tsx b/admin-pro-ui/src/framework/DynamicLoad/DynamicCode.tsx
deleted file mode 100644
index c32643b3..00000000
--- a/admin-pro-ui/src/framework/DynamicLoad/DynamicCode.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import * as Babel from "@babel/standalone";
-import React from "react";
-import ReactDOM from "react-dom/client";
-
-const loadComponent = (code: string, importComponents: React.ComponentType<any>[]):Promise<any> => {
-    return new Promise((resolve, reject) => {
-        try {
-            // 使用 Babel 编译包含 JSX 的代码
-            const compiledCode = Babel.transform(code, {
-                presets: ["react"]
-            }).code;
-
-            // 回调函数，返回组件
-            const callback = (Component: any) => {
-                resolve(Component);
-            }
-
-            // 依赖的组件的对象
-            const function_components = [
-                React,
-                ReactDOM,
-                callback,
-                ...importComponents,
-            ];
-
-            // 依赖的组件的名称
-            const function_componentsName = [
-                "React",
-                "ReactDOM",
-                "callback",
-                ...importComponents.map((component:any) =>{
-                    return component.displayName
-                }),
-            ]
-            // 使用 new Function 执行编译后的代码
-            // eslint-disable-next-line no-new-func
-            const renderComponent = new Function(...function_componentsName, compiledCode as string);
-            // 运行生成的代码
-            renderComponent(...function_components);
-        } catch (error) {
-            reject(error);
-        }
-    });
-};
-
-export default loadComponent;
diff --git a/admin-pro-ui/src/framework/DynamicLoad/PageLoader.tsx b/admin-pro-ui/src/framework/DynamicLoad/PageLoader.tsx
deleted file mode 100644
index 73689c63..00000000
--- a/admin-pro-ui/src/framework/DynamicLoad/PageLoader.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import React, {lazy, Suspense} from 'react';
-import {Spin} from "antd";
-
-export const loadPage = (pageName: string) => {
-
-    const PageComponent = lazy(() => {
-        return import(`@/pages/${pageName}`);
-    });
-
-    const fallback = (
-        <Spin size="large" tip="Loading">
-            <div style={{minHeight: 100}}/>
-        </Spin>
-    );
-
-    return (
-        <Suspense fallback={fallback}>
-            <PageComponent/>
-        </Suspense>
-    );
-};
diff --git a/admin-pro-ui/src/framework/Permission/Access/index.tsx b/admin-pro-ui/src/framework/Permission/Access/index.tsx
deleted file mode 100644
index 64bb5788..00000000
--- a/admin-pro-ui/src/framework/Permission/Access/index.tsx
+++ /dev/null
@@ -1,69 +0,0 @@
-import React from "react";
-import RoleControl from "@/utils/RoleControl";
-
-export interface AccessProps {
-    children?: React.ReactNode;
-
-    hasRoles?: string[];
-    hasAnyRoles?: string[];
-    isNotRoles?: boolean;
-    noRoles?: string[];
-    noAnyRoles?: string[];
-}
-
-const Access: React.FC<AccessProps> = (props) => {
-    const {hasRoles, hasAnyRoles, isNotRoles, noRoles, noAnyRoles} = props;
-    if (hasRoles) {
-        if (RoleControl.hasRoles(hasRoles)) {
-            return (
-                <>
-                    {props.children}
-                </>
-            )
-        }
-    }
-
-    if (hasAnyRoles) {
-        if (RoleControl.anyRoles(hasAnyRoles)) {
-            return (
-                <>
-                    {props.children}
-                </>
-            )
-        }
-    }
-
-    if (isNotRoles) {
-        if (RoleControl.isNotRoles()) {
-            return (
-                <>
-                    {props.children}
-                </>
-            )
-        }
-    }
-
-    if (noRoles) {
-        if (RoleControl.notHasRoles(noRoles)) {
-            return (
-                <>
-                    {props.children}
-                </>
-            )
-        }
-    }
-
-    if (noAnyRoles) {
-        if (RoleControl.notAnyRoles(noAnyRoles)) {
-            return (
-                <>
-                    {props.children}
-                </>
-            )
-        }
-    }
-
-    return null;
-}
-
-export default Access;
\ No newline at end of file
diff --git a/admin-pro-ui/src/framework/Permission/AccessProvider/handler.ts b/admin-pro-ui/src/framework/Permission/AccessProvider/handler.ts
deleted file mode 100644
index 08170ae8..00000000
--- a/admin-pro-ui/src/framework/Permission/AccessProvider/handler.ts
+++ /dev/null
@@ -1,102 +0,0 @@
-import RoleControl from "@/utils/RoleControl";
-
-interface AccessHandler {
-    match: (child: any) => boolean;
-    handle: (child: any) => any;
-}
-
-
-class HasRolesHandler implements AccessHandler {
-
-    authorize = 'has-roles';
-
-    match(child: any): boolean {
-        return child.props && child.props[this.authorize];
-    }
-
-    handle(child: any): any {
-        const roles = child.props[this.authorize];
-        if (RoleControl.hasRoles(roles)) {
-            return child;
-        }
-        return null;
-    }
-}
-
-class AnyRolesHandler implements AccessHandler {
-
-    authorize = 'has-any-roles';
-
-    match(child: any): boolean {
-        return child.props && child.props[this.authorize];
-    }
-
-    handle(child: any): any {
-        const roles = child.props[this.authorize];
-        if (RoleControl.anyRoles(roles)) {
-            return child;
-        }
-        return null;
-    }
-}
-
-class NotRolesHandler implements AccessHandler {
-
-    authorize = 'not-roles';
-
-    match(child: any): boolean {
-        return child.props && child.props[this.authorize];
-    }
-
-    handle(child: any): any {
-        if (RoleControl.isNotRoles()) {
-            return child;
-        }
-        return null;
-    }
-}
-
-class NoRolesHandler implements AccessHandler {
-
-    authorize = 'no-roles';
-
-    match(child: any): boolean {
-        return child.props && child.props[this.authorize];
-    }
-
-    handle(child: any): any {
-        const roles = child.props[this.authorize];
-        if (RoleControl.notHasRoles(roles)) {
-            return child;
-        }
-        return null;
-    }
-}
-
-class NoAnyRolesHandler implements AccessHandler {
-
-    authorize = 'no-any-roles';
-
-    match(child: any): boolean {
-        return child.props && child.props[this.authorize];
-    }
-
-    handle(child: any): any {
-        const roles = child.props[this.authorize];
-        if (RoleControl.notAnyRoles(roles)) {
-            return child;
-        }
-        return null;
-    }
-}
-
-
-export const accessHandlers: AccessHandler[] = [
-    new HasRolesHandler(),
-    new NoRolesHandler(),
-    new AnyRolesHandler(),
-    new NoAnyRolesHandler(),
-    new NotRolesHandler()
-];
-
-
diff --git a/admin-pro-ui/src/framework/Permission/AccessProvider/index.tsx b/admin-pro-ui/src/framework/Permission/AccessProvider/index.tsx
deleted file mode 100644
index 8a7dd561..00000000
--- a/admin-pro-ui/src/framework/Permission/AccessProvider/index.tsx
+++ /dev/null
@@ -1,41 +0,0 @@
-import React from "react";
-import {accessHandlers} from "@/framework/Permission/AccessProvider/handler";
-
-interface AccessProviderProps {
-    children: React.ReactNode;
-}
-
-const renderWithAccess = (child: any): any => {
-    if (!React.isValidElement(child)) {
-        return child;
-    }
-    if (child.props) {
-
-        // @ts-ignore
-        if (child.props.children) {
-            child = React.cloneElement(child, {
-                ...child.props,
-                // @ts-ignore
-                children: React.Children.map(child.props.children, (item: any) => {
-                    return renderWithAccess(item);
-                })
-            });
-        }
-
-        for (let i = 0; i < accessHandlers.length; i++) {
-            if (accessHandlers[i].match(child)) {
-                return accessHandlers[i].handle(child);
-            }
-        }
-
-        return child;
-    }
-    return null;
-};
-
-const AccessProvider: React.FC<AccessProviderProps> = (props) => {
-    const {children} = props;
-    return React.Children.map(children, child => renderWithAccess(child));
-};
-
-export default AccessProvider;
\ No newline at end of file
diff --git a/admin-pro-ui/src/framework/Permission/RoleKeyProvider/RoleKeyManager.ts b/admin-pro-ui/src/framework/Permission/RoleKeyProvider/RoleKeyManager.ts
deleted file mode 100644
index 7e2a7cfb..00000000
--- a/admin-pro-ui/src/framework/Permission/RoleKeyProvider/RoleKeyManager.ts
+++ /dev/null
@@ -1,26 +0,0 @@
-interface RoleKey {
-    key: string;
-    children?: RoleKey[];
-}
-
-class RoleKeyManager {
-    private roles: RoleKey[] = [];
-
-    private static manager = new RoleKeyManager();
-
-    static getInstances(): RoleKeyManager {
-        return RoleKeyManager.manager;
-    }
-
-    addRole(role: RoleKey): void {
-        this.roles.push(role);
-    }
-
-    public hasRole(code: string) {
-        return this.roles.some((role: RoleKey) => {
-            return role.key === code;
-        })
-    }
-}
-
-export default RoleKeyManager;
\ No newline at end of file
diff --git a/admin-pro-ui/src/framework/Permission/RoleKeyProvider/index.tsx b/admin-pro-ui/src/framework/Permission/RoleKeyProvider/index.tsx
deleted file mode 100644
index 9f125091..00000000
--- a/admin-pro-ui/src/framework/Permission/RoleKeyProvider/index.tsx
+++ /dev/null
@@ -1,43 +0,0 @@
-import React from "react";
-import RoleKeyManager from "@/framework/Permission/RoleKeyProvider/RoleKeyManager";
-
-interface RoleKeyProviderProps {
-    children: React.ReactNode;
-}
-
-const renderWithAccess = (child: any): any => {
-    if (!React.isValidElement(child)) {
-        return child;
-    }
-    if (child.props) {
-        // @ts-ignore
-        if (child.props.children) {
-            child = React.cloneElement(child, {
-                ...child.props,
-                // @ts-ignore
-                children: React.Children.map(child.props.children, (item: any) => {
-                    return renderWithAccess(item);
-                })
-            });
-        }
-
-        const roleKey = 'role-key';
-        const key = child.props && child.props[roleKey];
-        if(key) {
-            if (RoleKeyManager.getInstances().hasRole(key)) {
-                return child;
-            }else {
-                return null;
-            }
-        }
-        return child;
-    }
-    return null;
-};
-
-const RoleKeyProvider: React.FC<RoleKeyProviderProps> = (props) => {
-    const {children} = props;
-    return React.Children.map(children, child => renderWithAccess(child));
-};
-
-export default RoleKeyProvider;
\ No newline at end of file
diff --git a/admin-pro-ui/src/framework/Routes/MenuRouteManager.tsx b/admin-pro-ui/src/framework/Routes/MenuRouteManager.tsx
deleted file mode 100644
index 02cdc2dd..00000000
--- a/admin-pro-ui/src/framework/Routes/MenuRouteManager.tsx
+++ /dev/null
@@ -1,207 +0,0 @@
-import React from "react";
-import {loadPage} from "@/framework/DynamicLoad/PageLoader";
-import {Route} from "react-router";
-import {menus} from "@/config/menus";
-import RoleControl from "@/utils/RoleControl";
-import {cloneDeep} from 'lodash';
-import Icons from "@/components/icons";
-
-const accessFilter = (menu: Menu): boolean => {
-    if (menu.roles) {
-        if (menu.path === '/') {
-            return true;
-        }
-
-        if (menu.roles) {
-            return RoleControl.anyRoles(menu.roles);
-        }
-        return true;
-    }
-
-    if (menu.routes) {
-        menu.routes = menu.routes.filter((route: any) => {
-            return accessFilter(route);
-        });
-        return menu.routes.length > 0;
-    }
-    return true;
-}
-
-const loadMenuRoute = (menu: Menu): any => {
-    if (menu.roles) {
-        if (!accessFilter(menu)) {
-            return null;
-        }
-    }
-    if (menu.page) {
-        const element = loadPage(menu.page);
-        return (
-            <Route
-                key={menu.path}
-                path={menu.path}
-                element={element}
-            />
-        );
-    } else if (menu.routes) {
-        return menu.routes.map((route: any) => loadMenuRoute(route));
-    } else if (menu.element) {
-        const element = menu.element;
-        return (
-            <Route
-                key={menu.path}
-                path={menu.path}
-                element={element}
-            />
-        );
-    }
-    return null;
-};
-
-
-export interface Menu {
-    // 路由路径
-    path: string,
-    // 界面组件
-    element: React.ReactNode,
-    // 菜单名称
-    name: string,
-    // 菜单图标
-    icon?: string,
-    // 子菜单
-    routes?: Menu[],
-    // 所需任意角色
-    roles?: string[],
-    // 父菜单路径
-    parentPath?: string
-    // 页面路径，通过PageLoader加载到element
-    page?: string
-}
-
-// 菜单路由管理器
-export class MenuRouteManager {
-
-    // 单例对象
-    private static instance: MenuRouteManager;
-
-    // 本地菜单数据
-    menus = [] as any[];
-
-    // 路由数据
-    routes = [] as any[];
-
-    // 版本号
-    version = 0;
-
-    // 当前版本
-    currentVersion = -1;
-
-    private constructor(menus: any) {
-        this.menus = menus
-    }
-
-    public static getInstance() {
-        if (!MenuRouteManager.instance) {
-            MenuRouteManager.instance = new MenuRouteManager(menus);
-        }
-        return MenuRouteManager.instance;
-    }
-
-    public getRoutes() {
-        if (this.currentVersion === this.version) {
-            return this.routes;
-        }
-        this.routes = this.menus.map((menu: any) => loadMenuRoute(menu));
-        this.currentVersion = this.version
-        return this.routes;
-    }
-
-    public getMenus(mapping: boolean = true) {
-        const menuMap = (menu: any) => {
-            if (mapping) {
-                if (menu.icon) {
-                    menu.icon = <Icons icon={menu.icon}/>
-                }
-                if (menu.routes) {
-                    menu.routes = menu.routes.map(menuMap);
-                }
-            }
-            return menu;
-        }
-
-
-        if (this.menus.length === 0) {
-            return [];
-        }
-        const newMenus = cloneDeep(this.menus);
-        return newMenus.map(menuMap).filter((menu: any) => {
-            return accessFilter(menu);
-        });
-    }
-
-    public addMenu(menu: Menu) {
-        if (menu.parentPath) {
-            const updateMenu = (item: any) => {
-                if (item.path === menu.parentPath) {
-                    const routes = item.routes || [];
-                    if (menu.page) {
-                        menu.element = loadPage(menu.page);
-                    }
-                    routes.push(menu);
-                    item = {
-                        ...item,
-                        routes
-                    };
-                }
-                return item;
-            }
-            this.menus = this.menus.map(updateMenu);
-        } else {
-            this.menus.push(menu);
-        }
-        this.version++;
-    }
-
-    public updateMenu(menu: Menu) {
-        const updateMenu = (item: Menu) => {
-            const newMenu = {
-                icon: menu.icon,
-                name: menu.name,
-                page: menu.page,
-            } as any;
-
-            if (menu.page) {
-                newMenu.element = loadPage(menu.page);
-            }
-
-            if (item.path === menu.path) {
-                item = {
-                    ...item,
-                    ...newMenu
-                };
-            }
-            return item;
-        }
-
-        this.menus = this.menus.map(updateMenu);
-        this.version++;
-    }
-
-    public removeMenu(path: string) {
-        const removeMenu = (menu: any) => {
-            if (menu.path === path) {
-                return false;
-            }
-            if (menu.routes) {
-                menu.routes = menu.routes.filter(removeMenu);
-            }
-            return true;
-        }
-
-        this.menus = this.menus.filter(removeMenu);
-        this.version++;
-    }
-
-    public refresh() {
-        this.version++;
-    }
-}
diff --git a/admin-pro-ui/src/framework/Routes/RoutesProvider.tsx b/admin-pro-ui/src/framework/Routes/RoutesProvider.tsx
deleted file mode 100644
index e7b06dfd..00000000
--- a/admin-pro-ui/src/framework/Routes/RoutesProvider.tsx
+++ /dev/null
@@ -1,123 +0,0 @@
-import React, {createContext, lazy, Suspense, useContext, useState} from 'react';
-import {createHashRouter, RouterProvider} from 'react-router-dom';
-import {loadRemoteComponent, loadRemoteScript} from "@/utils/dynamicLoader";
-import {loadPage} from "@/framework/DynamicLoad/PageLoader";
-import NotFound from "@/layout/NotFound";
-import Layout from "@/layout";
-import {useDispatch} from "react-redux";
-import {refresh} from "@/store/MenuSlice";
-import {Menu, MenuRouteManager} from "@/framework/Routes/MenuRouteManager";
-import {routes as localRoutes} from "@/config/menus";
-
-const RouteContext = createContext<any>(null);
-
-export const useRoutesContext = () => useContext(RouteContext);
-
-interface Router {
-    path: string,
-    element: React.ReactNode,
-    children?: Router[]
-}
-
-interface PageRouter {
-    path: string,
-    pageName: string
-}
-
-interface DynamicComponentRouter {
-    path: string,
-    remoteUrl: string,
-    scope: string,
-    module: string
-}
-
-
-const RoutesProvider: React.FC = () => {
-    const dispatch = useDispatch();
-    const [routes, setRoutes] = useState<Router[]>([
-        {
-            path: '/*',
-            element: <Layout/>,
-            children: [
-                {
-                    path: '/*',
-                    element: <NotFound/>,
-                }
-            ]
-        },
-        ...localRoutes
-    ]);
-
-    const addRoute = (newRoute: Router) => {
-        setRoutes((prevRoutes) => [...prevRoutes, newRoute]);
-    };
-
-    const addMenu = (newMenu: Menu) => {
-        MenuRouteManager.getInstance().addMenu(newMenu);
-        dispatch(refresh());
-    };
-
-    const updateMenu = (newMenu: Menu) => {
-        MenuRouteManager.getInstance().updateMenu(newMenu);
-        dispatch(refresh());
-    };
-
-    const removeMenu = (path: string) => {
-        MenuRouteManager.getInstance().removeMenu(path);
-        dispatch(refresh());
-    };
-
-    const removeRoute = (path: string) => {
-        setRoutes((prevRoutes) => prevRoutes.filter(route => route.path !== path));
-    };
-
-    const addPageRoute = (router: PageRouter) => {
-        const newRoute = {
-            path: router.path,
-            element: loadPage(router.pageName),
-        };
-        addRoute(newRoute);
-    }
-
-    const addDynamicComponentRoute = (router: DynamicComponentRouter) => {
-        const dynamicLoadComponent = (remoteUrl: string, scope: string, module: string): Promise<React.ComponentType<any>> => {
-            return new Promise((resolve, reject) => {
-                loadRemoteScript(remoteUrl).then(() => {
-                    loadRemoteComponent(scope, module).then((ComponentModule: any) => {
-                        resolve(ComponentModule.default || ComponentModule);
-                    });
-                }).catch(ignore => {
-                });
-            })
-        }
-
-        const NewPage = lazy(async () => {
-            const Component = await dynamicLoadComponent(router.remoteUrl, router.scope, router.module);
-            return {default: Component};
-        });
-
-
-        const newRoute = {
-            path: router.path,
-            element: (
-                <Suspense fallback={"loading"}>
-                    <NewPage/>
-                </Suspense>
-            ),
-        };
-        addRoute(newRoute);
-    }
-
-    const hashRoutes = createHashRouter(routes);
-
-    return (
-        <RouteContext.Provider
-            value={{addRoute, removeRoute, addDynamicComponentRoute, addPageRoute, addMenu, removeMenu, updateMenu}}>
-            <RouterProvider
-                router={hashRoutes}
-            />
-        </RouteContext.Provider>
-    );
-};
-
-export default RoutesProvider;
diff --git a/admin-pro-ui/src/index.scss b/admin-pro-ui/src/index.scss
deleted file mode 100644
index 4109e9ba..00000000
--- a/admin-pro-ui/src/index.scss
+++ /dev/null
@@ -1,10 +0,0 @@
-body {
-  margin: 0;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-code {
-  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
-    monospace;
-}
diff --git a/admin-pro-ui/src/index.tsx b/admin-pro-ui/src/index.tsx
deleted file mode 100644
index 3cbfbf44..00000000
--- a/admin-pro-ui/src/index.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import React from 'react';
-import ReactDOM from 'react-dom/client';
-import reportWebVitals from './reportWebVitals';
-import RoutesProvider from "@/framework/Routes/RoutesProvider";
-import {Provider} from "react-redux";
-import store from "@/store/Redux";
-import {ConfigProvider} from "antd";
-import zhCN from 'antd/es/locale/zh_CN';
-import {theme} from "@/config/theme";
-import './index.scss';
-import "@/config/register.component";
-
-const root = ReactDOM.createRoot(
-    document.getElementById('root') as HTMLElement
-);
-
-root.render(
-    <React.StrictMode>
-        <Provider store={store}>
-
-            <ConfigProvider
-                locale={zhCN}
-                theme={{
-                    ...theme
-                }}
-            >
-                <RoutesProvider/>
-            </ConfigProvider>
-        </Provider>
-    </React.StrictMode>
-);
-
-// If you want to start measuring performance in your app, pass a function
-// to log results (for example: reportWebVitals(console.log))
-// or send to an analytics endpoint. Learn more: https://bit.ly/CRA-vitals
-reportWebVitals();
diff --git a/admin-pro-ui/src/jest.setup.ts b/admin-pro-ui/src/jest.setup.ts
deleted file mode 100644
index c74d7b05..00000000
--- a/admin-pro-ui/src/jest.setup.ts
+++ /dev/null
@@ -1,47 +0,0 @@
-import '@testing-library/jest-dom';
-import {TextEncoder} from 'util';
-
-// 添加全局对象
-global.TextEncoder = TextEncoder;
-
-// Mock window.matchMedia
-Object.defineProperty(window, 'matchMedia', {
-    writable: true,
-    value: jest.fn().mockImplementation(query => ({
-        matches: false,
-        media: query,
-        onchange: null,
-        addListener: jest.fn(),
-        removeListener: jest.fn(),
-        addEventListener: jest.fn(),
-        removeEventListener: jest.fn(),
-        dispatchEvent: jest.fn(),
-    })),
-});
-
-// Mock ResizeObserver
-global.ResizeObserver = class ResizeObserver {
-    observe() {
-    }
-
-    unobserve() {
-    }
-
-    disconnect() {
-    }
-};
-
-// Suppress findDOMNode warnings in test output
-const originalError = console.error;
-console.error = (...args) => {
-    if (/Warning.*findDOMNode/.test(args[0])) {
-        return;
-    }
-    originalError.call(console, ...args);
-};
-
-// Mock getComputedStyle
-global.getComputedStyle = jest.fn().mockImplementation(element => ({
-    getPropertyValue: jest.fn().mockReturnValue(''),
-    // Add any other style properties your tests might need
-}));
diff --git a/admin-pro-ui/src/layout/index.scss b/admin-pro-ui/src/layout/index.scss
deleted file mode 100644
index adf81653..00000000
--- a/admin-pro-ui/src/layout/index.scss
+++ /dev/null
@@ -1,3 +0,0 @@
-.breadcrumb-item {
-  color: #b88888;
-}
\ No newline at end of file
diff --git a/admin-pro-ui/src/layout/index.tsx b/admin-pro-ui/src/layout/index.tsx
deleted file mode 100644
index 2b3610a1..00000000
--- a/admin-pro-ui/src/layout/index.tsx
+++ /dev/null
@@ -1,109 +0,0 @@
-import {ActionType, ProLayout} from '@ant-design/pro-components';
-import React, {useEffect, useRef, useState} from 'react';
-import {Route, Routes} from "react-router";
-import {useNavigate} from "react-router-dom";
-import {MenuRouteManager} from "@/framework/Routes/MenuRouteManager";
-import AvatarHeader from "@/layout/AvatarHeader";
-import {loadHeaderAction} from "@/layout/HeaderAction";
-import {config} from "@/config/theme";
-import "./index.scss";
-import {useSelector} from "react-redux";
-import {RootState} from "@/store/Redux";
-import NotFound from "@/layout/NotFound";
-
-const welcomePath = config.welcomePath;
-const loginPath = config.loginPath;
-
-const Layout = () => {
-
-    const actionRef = useRef<ActionType>();
-    const [pathname, setPathname] = useState(welcomePath);
-
-    const menuVersion = useSelector((state: RootState) => state.menu.version);
-
-    const navigate = useNavigate();
-
-    const username = localStorage.getItem('username');
-
-    useEffect(() => {
-        const path = window.location.hash.replace('#', '') || welcomePath;
-        setPathname(path);
-        MenuRouteManager.getInstance().refresh();
-        actionRef.current?.reload();
-    }, [menuVersion]);
-
-
-    return (
-        <ProLayout
-            siderWidth={config.siderWidth}
-            layout={config.layout}
-            location={{
-                pathname,
-            }}
-            title={config.title}
-            logo={config.logo}
-            actionRef={actionRef}
-            waterMarkProps={{
-                content: username || config.waterMark,
-            }}
-            menu={{
-                request: async () => {
-                    return MenuRouteManager.getInstance().getMenus();
-                }
-            }}
-            breadcrumbProps={{
-                itemRender: (route: any, params, routes, paths) => {
-                    return (
-                        <label
-                            className={"breadcrumb-item"}
-                            onClick={() => {
-                                return;
-                            }}
-                        >
-                            {route.breadcrumbName}
-                        </label>
-                    );
-                }
-            }}
-            avatarProps={{
-                render: (props, defaultDom) => {
-                    return (
-                        <AvatarHeader props={props}/>
-                    )
-                }
-            }}
-            actionsRender={(props) => {
-                return loadHeaderAction(props);
-            }}
-            onPageChange={(location:any) => {
-                const token = localStorage.getItem('token');
-                if (!token) {
-                    navigate(loginPath, {replace: true});
-                }else{
-                    navigate(location.pathname);
-                }
-            }}
-            menuItemRender={(item, dom) => (
-                <div
-                    style={{
-                        width:"100%"
-                    }}
-                    onClick={() => {
-                        const currentPath = item.path || welcomePath
-                        setPathname(currentPath);
-                        navigate(currentPath);
-                    }}
-                >
-                    {dom}
-                </div>
-            )}
-        >
-            <Routes>
-                {MenuRouteManager.getInstance().getRoutes()}
-                <Route path={"/*"} key={"404"} element={<NotFound/>}/>
-            </Routes>
-        </ProLayout>
-    );
-};
-
-export default Layout;
diff --git a/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx b/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
deleted file mode 100644
index 8f1cfbc4..00000000
--- a/admin-pro-ui/src/pages/flow/leave/LeaveForm.tsx
+++ /dev/null
@@ -1,52 +0,0 @@
-import React, {useEffect} from "react";
-import {FlowFormViewProps} from "@codingapi/ui-framework";
-import {Form,FormInput,FormTextArea} from "@codingapi/form-pc";
-import {ValidateUtils} from "@codingapi/ui-framework";
-
-const LeaveForm: React.FC<FlowFormViewProps> = (props) => {
-
-    useEffect(() => {
-        if (props.dataVersion && props.data) {
-            console.log('data',props.data);
-            props.form?.setFieldsValue({
-                ...props.data
-            });
-        }
-    }, [props.dataVersion]);
-
-    return (
-        <Form
-            form={props.form}
-            layout={"vertical"}
-        >
-
-            <FormInput
-                name={"id"}
-                hidden={true}
-            />
-
-            <FormInput
-                name={"username"}
-                hidden={true}
-            />
-
-            <FormInput
-                name={"days"}
-                label={"请假天数"}
-               inputType={"number"}
-               required={true}
-                validateFunction={ValidateUtils.validateNotEmpty}
-            />
-
-            <FormTextArea
-                name={"desc"}
-                label={"请假原因"}
-                required={true}
-                validateFunction={ValidateUtils.validateNotEmpty}
-            />
-
-        </Form>
-    )
-}
-
-export default LeaveForm;
diff --git a/admin-pro-ui/src/pages/flow/leave/index.tsx b/admin-pro-ui/src/pages/flow/leave/index.tsx
deleted file mode 100644
index bd1470fb..00000000
--- a/admin-pro-ui/src/pages/flow/leave/index.tsx
+++ /dev/null
@@ -1,71 +0,0 @@
-import React from "react";
-import {ActionType, PageContainer, ProTable} from "@ant-design/pro-components";
-import {list} from "@/api/leave";
-import {Button} from "antd";
-import LeaveForm from "@/pages/flow/leave/LeaveForm";
-import {FlowModelView} from "@codingapi/flow-pc";
-
-const LeavePage = () => {
-
-    const [visible, setVisible] = React.useState(false);
-
-    const username = localStorage.getItem('username');
-
-    const actionRef = React.useRef<ActionType>();
-    const columns = [
-        {
-            title: '编号',
-            dataIndex: 'id',
-            search: false
-        },
-        {
-            title: '说明',
-            dataIndex: 'desc',
-        },
-        {
-            title: '请假天数',
-            dataIndex: 'days',
-        },
-        {
-            title: '请假人',
-            dataIndex: 'username',
-        }
-    ] as any[];
-
-
-    return (
-        <PageContainer>
-            <ProTable
-                actionRef={actionRef}
-                toolBarRender={() => [
-                    <Button
-                        type={"primary"}
-                        onClick={() => {
-                            setVisible(true);
-                        }}
-                    >发起请假</Button>
-                ]}
-                columns={columns}
-                search={false}
-                rowKey={"id"}
-                request={async (params, sort, filter) => {
-                    return list(params, sort, filter, []);
-                }}
-            />
-
-            <FlowModelView
-                visible={visible}
-                setVisible={setVisible}
-                view={LeaveForm}
-                workCode={"leave"}
-                formParams={{
-                    clazzName: 'com.codingapi.example.infra.flow.form.LeaveForm',
-                    username: username
-                }}
-            />
-
-        </PageContainer>
-    )
-}
-
-export default LeavePage;
diff --git a/admin-pro-ui/src/pages/flow/record/index.scss b/admin-pro-ui/src/pages/flow/record/index.scss
deleted file mode 100644
index 56c4a77a..00000000
--- a/admin-pro-ui/src/pages/flow/record/index.scss
+++ /dev/null
@@ -1,7 +0,0 @@
-.record-read{
-  font-weight: normal;
-}
-
-.record-unread{
-  font-weight: bold;
-}
diff --git a/admin-pro-ui/src/pages/flow/record/index.tsx b/admin-pro-ui/src/pages/flow/record/index.tsx
deleted file mode 100644
index fada0816..00000000
--- a/admin-pro-ui/src/pages/flow/record/index.tsx
+++ /dev/null
@@ -1,328 +0,0 @@
-import React, {useEffect} from "react";
-import {ActionType, PageContainer, ProTable} from "@ant-design/pro-components";
-import {
-    findAllByOperatorId,
-    findDoneByOperatorId,
-    findInitiatedByOperatorId,
-    findPostponedTodoByOperatorId,
-    findTimeoutTodoByOperatorId,
-    findTodoByOperatorId,
-    urge
-} from "@/api/flow";
-import moment from "moment";
-import {message, Tabs} from "antd";
-import "./index.scss";
-import LeaveForm from "@/pages/flow/leave/LeaveForm";
-import {FlowModelView} from "@codingapi/flow-pc";
-
-const FlowRecordPage = () => {
-
-    const [flowViewVisible, setFlowViewVisible] = React.useState(false);
-    const [currentId, setCurrentId] = React.useState<string>('');
-    const [reviewVisible, setReviewVisible] = React.useState(false);
-
-
-    const [key, setKey] = React.useState('todo');
-    const todoActionRef = React.useRef<ActionType>();
-    const doneActionRef = React.useRef<ActionType>();
-    const initiatedActionRef = React.useRef<ActionType>();
-    const timeoutTodoActionRef = React.useRef<ActionType>();
-    const postponedTodoActionRef = React.useRef<ActionType>();
-    const allTodoActionRef = React.useRef<ActionType>();
-
-
-    const handlerUrgeFlow = (recordId: any) => {
-        const body = {
-            recordId,
-        }
-        urge(body).then(res => {
-            if (res.success) {
-                message.success('催办提醒已发送').then();
-                reloadTable();
-            }
-        })
-    }
-
-    const columns = [
-        {
-            title: '编号',
-            dataIndex: 'id',
-            search: false
-        },
-        {
-            title: 'pre编号',
-            dataIndex: 'preId',
-            search: false
-        },
-        {
-            title: '流程编号',
-            dataIndex: 'processId',
-        },
-        {
-            title: '标题',
-            dataIndex: 'title',
-            render: (value: any, record: any) => {
-                return (
-                    <div dangerouslySetInnerHTML={{__html: value}}></div>
-                );
-            }
-        },
-        {
-            title: '创建时间',
-            dataIndex: 'createTime',
-            valueType: 'dateTime'
-        },
-        {
-            title: '是否延期',
-            dataIndex: 'postponedCount',
-            render: (text: any) => {
-                return text > 1 ? '延期' : '-';
-            }
-        },
-        {
-            title: '超时到期时间',
-            dataIndex: 'timeoutTime',
-            render: (text: any) => {
-                return text <= 0 ? '-' : moment(text).format("YYYY-MM-DD HH:mm:ss");
-            }
-        },
-        {
-            title: '流程发起人',
-            dataIndex: 'createOperatorName',
-        },
-        {
-            title: '流程审批人',
-            dataIndex: 'currentOperatorName',
-        },
-        {
-            title: '状态',
-            dataIndex: 'flowType',
-            render: (text: any) => {
-                if (text === 'TODO') {
-                    return '办理中';
-                }
-                if (text === 'DONE') {
-                    return '已办理';
-                }
-                if (text === 'TRANSFER') {
-                    return '已转办';
-                }
-                if (text === 'CIRCULATE') {
-                    return '抄送';
-                }
-                return text;
-            }
-        },
-        {
-            title: '办理意见',
-            dataIndex: 'opinionAdvice',
-        },
-        {
-            title: '流程状态',
-            dataIndex: 'flowStatus',
-            render: (text: any) => {
-                if (text === 'RUNNING') {
-                    return '进行中';
-                }
-                if (text === 'FINISH') {
-                    return '已结束';
-                }
-                return text;
-            }
-        },
-        {
-            title: '更新时间',
-            dataIndex: 'updateTime',
-            valueType: 'dateTime'
-        },
-        {
-            title: '操作',
-            dataIndex: 'option',
-            valueType: 'option',
-            render: (_: any, record: any) => {
-
-                return [
-                    <a
-                        key={"detail"}
-                        onClick={() => {
-                            setCurrentId(record.id);
-                            setReviewVisible(true);
-                            setFlowViewVisible(true);
-                        }}
-                    >详情</a>,
-                    <a
-                        key={"submit"}
-                        onClick={() => {
-                            setCurrentId(record.id);
-                            setReviewVisible(false);
-                            setFlowViewVisible(true);
-                        }}
-                    >办理</a>,
-
-                    <a
-                        key={"urge"}
-                        onClick={() => {
-                            handlerUrgeFlow(record.id);
-                        }}
-                    >催办</a>,
-                ]
-            }
-        }
-    ] as any[];
-
-
-    const reloadTable = () => {
-        if (key === 'todo') {
-            todoActionRef.current?.reload();
-        }
-        if (key === 'done') {
-            doneActionRef.current?.reload();
-        }
-        if (key === 'initiated') {
-            initiatedActionRef.current?.reload();
-        }
-        if (key === 'timeoutTodo') {
-            timeoutTodoActionRef.current?.reload();
-        }
-        if (key === 'postponedTodo') {
-            postponedTodoActionRef.current?.reload();
-        }
-        if (key === 'all') {
-            allTodoActionRef.current?.reload();
-        }
-    }
-
-    useEffect(() => {
-        reloadTable();
-    }, [flowViewVisible, key]);
-
-    return (
-        <PageContainer>
-
-            <Tabs
-                onChange={(key) => {
-                    setKey(key);
-                }}
-                items={[
-                    {
-                        label: '我的待办',
-                        key: 'todo',
-                        children: (
-                            <ProTable
-                                actionRef={todoActionRef}
-                                search={false}
-                                columns={columns}
-                                rowClassName={(record) => {
-                                    return record.read ? "record-read" : "record-unread";
-                                }}
-                                request={async (params, sort, filter) => {
-                                    return findTodoByOperatorId(params, sort, filter, []);
-                                }}
-                            />
-                        )
-                    },
-                    {
-                        label: '我的已办',
-                        key: 'done',
-                        children: (
-                            <ProTable
-                                actionRef={doneActionRef}
-                                search={false}
-                                columns={columns}
-                                rowClassName={(record) => {
-                                    return record.read ? "record-read" : "record-unread";
-                                }}
-                                request={async (params, sort, filter) => {
-                                    return findDoneByOperatorId(params, sort, filter, []);
-                                }}
-                            />
-                        )
-                    },
-                    {
-                        label: '我发起的',
-                        key: 'initiated',
-                        children: (
-                            <ProTable
-                                actionRef={initiatedActionRef}
-                                search={false}
-                                columns={columns}
-                                rowClassName={(record) => {
-                                    return record.read ? "record-read" : "record-unread";
-                                }}
-                                request={async (params, sort, filter) => {
-                                    return findInitiatedByOperatorId(params, sort, filter, []);
-                                }}
-                            />
-                        )
-                    },
-                    {
-                        label: '超时待办',
-                        key: 'timeoutTodo',
-                        children: (
-                            <ProTable
-                                actionRef={timeoutTodoActionRef}
-                                search={false}
-                                columns={columns}
-                                rowClassName={(record) => {
-                                    return record.read ? "record-read" : "record-unread";
-                                }}
-                                request={async (params, sort, filter) => {
-                                    return findTimeoutTodoByOperatorId(params, sort, filter, []);
-                                }}
-                            />
-                        )
-                    },
-
-                    {
-                        label: '延期待办',
-                        key: 'postponedTodo',
-                        children: (
-                            <ProTable
-                                actionRef={postponedTodoActionRef}
-                                search={false}
-                                columns={columns}
-                                rowClassName={(record) => {
-                                    return record.read ? "record-read" : "record-unread";
-                                }}
-                                request={async (params, sort, filter) => {
-                                    return findPostponedTodoByOperatorId(params, sort, filter, []);
-                                }}
-                            />
-                        )
-                    },
-                    {
-                        label: '全部流程',
-                        key: 'all',
-                        children: (
-                            <ProTable
-                                actionRef={allTodoActionRef}
-                                search={false}
-                                columns={columns}
-                                rowClassName={(record) => {
-                                    return record.read ? "record-read" : "record-unread";
-                                }}
-                                request={async (params, sort, filter) => {
-                                    return findAllByOperatorId(params, sort, filter, []);
-                                }}
-                            />
-                        )
-                    },
-                ]}
-            />
-
-
-            <FlowModelView
-                visible={flowViewVisible}
-                setVisible={setFlowViewVisible}
-                id={currentId}
-                view={{
-                    'default': LeaveForm
-                }}
-            />
-
-        </PageContainer>
-    )
-}
-
-
-export default FlowRecordPage;
diff --git a/admin-pro-ui/src/pages/flow/user/index.tsx b/admin-pro-ui/src/pages/flow/user/index.tsx
deleted file mode 100644
index d52717ec..00000000
--- a/admin-pro-ui/src/pages/flow/user/index.tsx
+++ /dev/null
@@ -1,252 +0,0 @@
-import React, {useRef} from "react";
-import {ActionType, PageContainer, ProTable} from "@ant-design/pro-components";
-import {changeManager, entrust, list, remove, removeEntrust, save} from "@/api/user";
-import {Button, message, Modal, Popconfirm, Space} from "antd";
-import {DeleteOutlined, SettingOutlined} from "@ant-design/icons";
-import UserSelect from "@/pages/flow/user/select";
-import {Form,FormInput,FormSwitch} from "@codingapi/form-pc";
-import {ValidateUtils} from "@codingapi/ui-framework";
-
-const UserPage = () => {
-
-    const [visible, setVisible] = React.useState(false);
-    const [selectUserVisible, setSelectUserVisible] = React.useState(false);
-
-    const [user, setUser] = React.useState<any>({});
-
-    const actionRef = useRef<ActionType>();
-    const form = Form.useForm();
-
-    const handleSave = (values: any) => {
-        save(values).then(res => {
-            if (res.success) {
-                setVisible(false);
-                message.success("保存成功").then();
-                actionRef.current?.reload();
-            }
-        })
-    }
-
-    const handlerEntrust = (values: any) => {
-        entrust(values).then(res => {
-            if (res.success) {
-                message.success("设置成功").then();
-                actionRef.current?.reload();
-            }
-        })
-    }
-
-    const handlerRemoveEntrust = (id: any) => {
-        removeEntrust(id).then(res => {
-            if (res.success) {
-                message.success("移除成功").then();
-                actionRef.current?.reload();
-            }
-        })
-    }
-
-    const handlerRemove = (id: any) => {
-        remove(id).then(res => {
-            if (res.success) {
-                message.success("删除成功").then();
-                actionRef.current?.reload();
-            }
-        })
-    }
-
-
-    const handlerChangeManager = (id: any) => {
-        changeManager(id).then(res => {
-            if (res.success) {
-                message.success("设置成功").then();
-                actionRef.current?.reload();
-            }
-        })
-    }
-
-    const columns = [
-        {
-            title: '编号',
-            dataIndex: 'id',
-            search: false
-        },
-        {
-            title: '姓名',
-            dataIndex: 'name',
-        },
-        {
-            title: '是否流程管理员',
-            dataIndex: 'flowManager',
-            render: (text: any, record: any) => {
-                return (
-                    <Space>
-                        {record.flowManager ? "是" : "否"}
-
-                        <Popconfirm
-                            title={"确认要设置为流程管理员吗？"}
-                            onConfirm={() => {
-                                handlerChangeManager(record.id);
-                            }}
-                            okText={"确认"}
-                            cancelText={"取消"}
-                        >
-                            <a> <SettingOutlined/></a>
-                        </Popconfirm>
-                    </Space>
-                )
-            }
-        },
-        {
-            title: '账号名',
-            dataIndex: 'username',
-        },
-        {
-            title: '委托人',
-            dataIndex: 'entrustOperatorName',
-            render: (text: any, record: any) => {
-                return (
-                    <Space>
-                        {record.entrustOperatorName}
-
-                        <a onClick={() => {
-                            setUser(record);
-                            setSelectUserVisible(true);
-                        }}> <SettingOutlined/></a>
-
-                        {record.entrustOperatorId > 0 && (
-                            <Popconfirm
-                                title={"确认要移除委托人吗？"}
-                                onConfirm={() => {
-                                    handlerRemoveEntrust(record.id);
-                                }}
-                            >
-                                <a><DeleteOutlined/></a>
-                            </Popconfirm>
-                        )}
-                    </Space>
-                )
-            }
-        },
-        {
-            title: '创建时间',
-            dataIndex: 'createTime',
-            valueType: 'dateTime',
-        },
-        {
-            title: '操作',
-            valueType: 'option',
-            render: (text: any, record: any) => {
-                return [
-                    <a key={"editor"} onClick={() => {
-                        form.setFieldsValue(record);
-                        form.setFieldValue("password", "");
-
-                        setVisible(true);
-
-                    }}>编辑</a>,
-                    <Popconfirm
-                        key={"remove"}
-                        title={"确认要删除吗？"}
-                        onConfirm={() => {
-                            handlerRemove(record.id);
-                        }}>
-                        <a>删除</a>
-                    </Popconfirm>
-                ]
-            }
-        }
-
-    ] as any[];
-
-    return (
-        <PageContainer>
-                <ProTable
-                    actionRef={actionRef}
-                    toolBarRender={() => [
-                        <Button
-                            type={"primary"}
-                            onClick={() => {
-                                setVisible(true);
-                            }}
-                        >创建用户</Button>
-                    ]}
-
-                    columns={columns}
-                    rowKey={"id"}
-                    search={false}
-                    request={async (params, sort, filter) => {
-                        return list(params, sort, filter, []);
-                    }}
-                />
-
-                <Modal
-                    title={"编辑用户"}
-                    open={visible}
-                    onClose={()=>{
-                        setVisible(false);
-                    }}
-                    onCancel={()=>{
-                        setVisible(false);
-                    }}
-                    onOk={async ()=>{
-                        await form.submit();
-                    }}
-                >
-                    <Form
-                        layout={"vertical"}
-                        form={form}
-                        onFinish={async (values) => {
-                            handleSave(values);
-                        }}
-                    >
-                        <FormInput
-                            name={"id"}
-                            hidden={true}
-                        />
-
-                        <FormInput
-                            name={"name"}
-                            label={"姓名"}
-                            required={true}
-                            validateFunction={ValidateUtils.validateNotEmpty}
-                        />
-
-                        <FormInput
-                            name={"username"}
-                            label={"登录账号"}
-                            required={true}
-                            validateFunction={ValidateUtils.validateNotEmpty}
-                        />
-
-                        <FormInput
-                            name={"password"}
-                            label={"登录密码"}
-                            required={true}
-                            validateFunction={ValidateUtils.validateNotEmpty}
-                        />
-
-                        <FormSwitch
-                            name={"flowManager"}
-                            label={"是否流程管理员"}
-                        />
-                    </Form>
-                </Modal>
-
-                <UserSelect
-                    multiple={false}
-                    visible={selectUserVisible}
-                    setVisible={setSelectUserVisible}
-                    onSelect={(selectedRowKeys) => {
-                        if (selectedRowKeys && selectedRowKeys.length > 0) {
-                            handlerEntrust({
-                                id: user.id,
-                                entrustUserId: selectedRowKeys[0].id
-                            });
-                        }
-                    }}
-                />
-        </PageContainer>
-    )
-}
-
-export default UserPage;
diff --git a/admin-pro-ui/src/pages/flow/user/select.tsx b/admin-pro-ui/src/pages/flow/user/select.tsx
deleted file mode 100644
index 0e5d79e9..00000000
--- a/admin-pro-ui/src/pages/flow/user/select.tsx
+++ /dev/null
@@ -1,74 +0,0 @@
-import React from "react";
-import {ProTable} from "@ant-design/pro-components";
-import {list} from "@/api/user";
-import {Modal} from "antd";
-
-
-interface UserSelectProps{
-    multiple?: boolean;
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    onSelect: (record: any[]) => void;
-}
-
-const UserSelect:React.FC<UserSelectProps> = (props) => {
-
-    const [selectedRows, setSelectedRows] = React.useState<any[]>([]);
-
-    const columns = [
-        {
-            title: '编号',
-            dataIndex: 'id',
-            search: false
-        },
-        {
-            title: '姓名',
-            dataIndex: 'name',
-        },
-        {
-            title: '账号名',
-            dataIndex: 'username',
-        },
-
-        {
-            title: '创建时间',
-            dataIndex: 'createTime',
-            valueType: 'dateTime',
-        },
-
-    ] as any[];
-    return (
-        <Modal
-            width={"60%"}
-            open={props.visible}
-            onCancel={() => props.setVisible(false)}
-            onClose={() => props.setVisible(false)}
-            destroyOnClose={true}
-            title={"选择用户"}
-            onOk={() => {
-                if (props.onSelect) {
-                    props.onSelect(selectedRows);
-                }
-                props.setVisible(false);
-            }}
-        >
-            <ProTable
-                columns={columns}
-                rowKey={"id"}
-                search={false}
-                rowSelection={{
-                    type: props.multiple ? 'checkbox' : 'radio',
-                    selectedRowKeys:selectedRows.map(item=>item.id),
-                    onChange: (selectedRowKeys,selectedRows) => {
-                        setSelectedRows(selectedRows);
-                    }
-                }}
-                request={async (params, sort, filter) => {
-                    return list(params, sort, filter, []);
-                }}
-            />
-        </Modal>
-    )
-};
-
-export default UserSelect;
diff --git a/admin-pro-ui/src/pages/flow/work/index.tsx b/admin-pro-ui/src/pages/flow/work/index.tsx
deleted file mode 100644
index 4c0719b2..00000000
--- a/admin-pro-ui/src/pages/flow/work/index.tsx
+++ /dev/null
@@ -1,304 +0,0 @@
-import React from "react";
-import {Flow,FlowActionType} from "@codingapi/flow-pc";
-import {ActionType, PageContainer, ProTable} from "@ant-design/pro-components";
-import {changeState, copy, list, remove, save, schema} from "@/api/flow";
-import {Button, Drawer, message, Modal, Popconfirm, Space} from "antd";
-import {Form,FormInput,FormTextArea,FormSwitch} from "@codingapi/form-pc";
-import {ValidateUtils} from "@codingapi/ui-framework";
-
-const FlowPage = () => {
-
-    const [visible, setVisible] = React.useState(false);
-    const [editorVisible, setEditorVisible] = React.useState(false);
-    const flowActionType = React.useRef<FlowActionType>(null);
-    const form = Form.useForm();
-    const actionRef = React.useRef<ActionType>();
-
-    const [current, setCurrent] = React.useState<any>(null);
-
-    const handlerDelete = async (id: any) => {
-        const res = await remove(id);
-        if (res.success) {
-            message.success("保存成功");
-        }
-        actionRef.current?.reload();
-    }
-
-    const handlerCopy = async (id: any) => {
-        const res = await copy(id);
-        if (res.success) {
-            message.success("复制成功");
-        }
-        actionRef.current?.reload();
-    }
-
-
-    const handlerChangeState = async (id: any) => {
-        const res = await changeState(id);
-        if (res.success) {
-            message.success("修改成功");
-        }
-        actionRef.current?.reload();
-    }
-
-
-    const handlerSave = async (values: any) => {
-        const res = await save(values);
-        setEditorVisible(false);
-        if (res.success) {
-            message.success("保存成功");
-        }
-        actionRef.current?.reload();
-    }
-
-    const handlerSchema = async (json: any) => {
-        const res = await schema({
-            id: current.id,
-            schema: json
-        });
-        if (res.success) {
-            message.success("保存成功");
-            setVisible(false);
-        }
-        actionRef.current?.reload();
-    }
-
-    const columns = [
-        {
-            title: '编号',
-            dataIndex: 'id',
-            search: false,
-        },
-        {
-            title: '编码',
-            dataIndex: 'code',
-        },
-        {
-            title: '标题',
-            dataIndex: 'title',
-        },
-        {
-            title: '说明',
-            dataIndex: 'description',
-            valueType: 'text',
-            search: false,
-        },
-        {
-            title: '创建时间',
-            dataIndex: 'createTime',
-            valueType: 'dateTime',
-            search: false,
-        },
-        {
-            title: '修改时间',
-            dataIndex: 'updateTime',
-            valueType: 'dateTime',
-            search: false,
-        },
-        {
-            title: '状态',
-            dataIndex: 'enable',
-            search: false,
-            render: (text: any, record: any) => {
-                return (
-                    <Popconfirm
-                        title={`确认要${record.enable ? '禁用' : '启用'}吗？`}
-                        onConfirm={async () => {
-                            await handlerChangeState(record.id);
-                        }}
-                    >
-                        <a>{record.enable ? '启用' : '禁用'}</a>
-                    </Popconfirm>
-                )
-            }
-        },
-        {
-            title: '操作',
-            valueType: 'option',
-            render: (_: any, record: any) => [
-                <a
-                    key="design"
-                    onClick={() => {
-                        setCurrent(record);
-                        setVisible(true);
-                    }}
-                >
-                    设计
-                </a>,
-
-                <a
-                    key="editable"
-                    onClick={() => {
-                        form.setFieldsValue(record);
-                        setEditorVisible(true);
-                    }}
-                >
-                    编辑
-                </a>,
-
-                <a
-                    key="copy"
-                    onClick={async () => {
-                        await handlerCopy(record.id);
-                    }}
-                >
-                    复制
-                </a>,
-
-                <Popconfirm
-                    key="delete"
-                    title={"确认删除?"}
-                    onConfirm={async () => {
-                        await handlerDelete(record.id);
-                    }}
-                >
-                    <a
-                        key="delete"
-                    >
-                        删除
-                    </a>
-                </Popconfirm>
-            ]
-        }
-
-    ] as any[];
-    return (
-        <PageContainer>
-            <ProTable
-                data-testid={"flow-table"}
-                actionRef={actionRef}
-                rowKey={"id"}
-                columns={columns}
-                toolBarRender={() => {
-                    return [
-                        <Button
-                            data-testid={"flow-add-btn"}
-                            type={"primary"}
-                            onClick={() => {
-                                form.reset();
-                                setEditorVisible(true);
-                            }}
-                        >新增</Button>
-                    ]
-                }}
-                request={async (params, sort, filter) => {
-                    return list(params, sort, filter, [
-                        {
-                            key: "title",
-                            type: "LIKE"
-                        }
-                    ]);
-                }}
-            />
-
-            <Modal
-                data-testid={"flow-editor"}
-                title="编辑流程"
-                open={editorVisible}
-                destroyOnClose={true}
-                onClose={()=>{
-                    setEditorVisible(false)
-                }}
-                onCancel={()=>{
-                    setEditorVisible(false)
-                }}
-                onOk={async ()=>{
-                    await form.submit();
-                }}
-            >
-
-                <Form
-                    form={form}
-                    layout={"vertical"}
-                    onFinish={handlerSave}
-                >
-                    <FormInput
-                        name={"id"}
-                        hidden={true}
-                    />
-
-                    <FormInput
-                        name={"title"}
-                        label={"标题"}
-                        required={true}
-                        validateFunction={ValidateUtils.validateNotEmpty}
-                    />
-
-                    <FormInput
-                        name={"code"}
-                        label={"编码"}
-                        required={true}
-                        validateFunction={ValidateUtils.validateNotEmpty}
-                    />
-
-                    <FormTextArea
-                        name={"description"}
-                        label={"描述"}
-                    />
-
-                    <FormInput
-                        name={"postponedMax"}
-                        tooltip={"允许流程最大的延期次数"}
-                        label={"最大延期次数"}
-                        inputType={'number'}
-                        required={true}
-                        validateFunction={ValidateUtils.validateNotEmpty}
-                    />
-
-                    <FormSwitch
-                        name={"skipIfSameApprover"}
-                        tooltip={"是否跳过相同审批人，默认为否"}
-                        label={"是否跳过相同审批人"}
-                    />
-                </Form>
-
-            </Modal>
-
-
-            <Drawer
-                title="流程设计"
-                width={"100%"}
-                open={visible}
-                onClose={() => {
-                    setVisible(false);
-                }}
-                destroyOnClose={true}
-                style={{
-                    padding: 0,
-                    margin: 0
-                }}
-                extra={
-                    <Space>
-
-                        <Button
-                            type={"primary"}
-                            onClick={async () => {
-                                const data = flowActionType.current?.getData();
-                                const json = JSON.stringify(data);
-                                await handlerSchema(json);
-                            }}
-                        >
-                            保存
-                        </Button>
-
-                        <Button
-                            onClick={() => {
-                                setVisible(false);
-                            }}
-                        >
-                            取消
-                        </Button>
-                    </Space>
-                }
-            >
-                <Flow
-                    data={current?.schema ? JSON.parse(current?.schema) : null}
-                    actionRef={flowActionType}
-                />
-            </Drawer>
-
-        </PageContainer>
-    )
-};
-
-export default FlowPage;
diff --git a/admin-pro-ui/src/pages/flow/work/select.tsx b/admin-pro-ui/src/pages/flow/work/select.tsx
deleted file mode 100644
index 341db532..00000000
--- a/admin-pro-ui/src/pages/flow/work/select.tsx
+++ /dev/null
@@ -1,96 +0,0 @@
-import React from "react";
-import {ProTable} from "@ant-design/pro-components";
-import {list} from "@/api/flow";
-import {Modal} from "antd";
-
-
-interface FlowSelectProps {
-    multiple?: boolean;
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    onSelect: (record: any) => void;
-}
-
-const FlowSelect: React.FC<FlowSelectProps> = (props) => {
-
-    const [selectedRows, setSelectedRows] = React.useState<any[]>([]);
-
-    const columns = [
-        {
-            title: '编号',
-            dataIndex: 'id',
-            search: false,
-        },
-        {
-            title: '标题',
-            dataIndex: 'title',
-        },
-        {
-            title: '说明',
-            dataIndex: 'description',
-            valueType: 'text',
-            search: false,
-        },
-        {
-            title: '创建时间',
-            dataIndex: 'createTime',
-            valueType: 'dateTime',
-            search: false,
-        },
-        {
-            title: '修改时间',
-            dataIndex: 'updateTime',
-            valueType: 'dateTime',
-            search: false,
-        },
-        {
-            title: '状态',
-            dataIndex: 'enable',
-            search: false,
-            render: (text: any, record: any) => {
-                return (
-                    <>
-                        {record.enable ? '启用' : '禁用'}
-                    </>
-                )
-            }
-        },
-
-    ] as any[];
-    return (
-        <Modal
-            width={"60%"}
-            open={props.visible}
-            onCancel={() => props.setVisible(false)}
-            onClose={() => props.setVisible(false)}
-            destroyOnClose={true}
-            title={"选择流程"}
-            onOk={() => {
-                if (props.onSelect) {
-                    if (selectedRows.length > 0) {
-                        props.onSelect(selectedRows[0]);
-                    }
-                }
-                props.setVisible(false);
-            }}
-        >
-            <ProTable
-                columns={columns}
-                rowKey={"id"}
-                search={false}
-                rowSelection={{
-                    type: 'radio',
-                    selectedRowKeys:selectedRows.map(item=>item.id),
-                    onChange: (selectedRowKeys,selectedRows) => {
-                        setSelectedRows(selectedRows);
-                    }
-                }}
-                request={async (params, sort, filter) => {
-                    return list(params, sort, filter, []);
-                }}
-            />
-        </Modal>
-    )
-};
-
-export default FlowSelect;
diff --git a/admin-pro-ui/src/pages/form/index.tsx b/admin-pro-ui/src/pages/form/index.tsx
deleted file mode 100644
index 34650e78..00000000
--- a/admin-pro-ui/src/pages/form/index.tsx
+++ /dev/null
@@ -1,588 +0,0 @@
-import React from 'react';
-import {PageContainer} from "@ant-design/pro-components";
-import {Button, Col, message, Row} from "antd";
-import {
-    FormCascader,
-    FormCode,
-    FormColor,
-    FormDate,
-    FormRadio,
-    FormRate,
-    FormSelect,
-    FormSlider,
-    FormStepper,
-    FormSwitch,
-    FormTextArea,
-    FormUploader,
-    FormCheckbox,
-    FormCaptcha,
-    FormPassword,
-    FormInput,
-    Form
-} from "@codingapi/form-pc";
-import {FormInstance,FormField} from "@codingapi/ui-framework";
-
-
-const FooterButtons: React.FC<{ formInstance: FormInstance }> = ({formInstance}) => {
-    const data = {
-        user: {
-            name: '张三',
-            age: 18,
-            password: '123456',
-            code: '123',
-            checkbox: '1,2',
-            radio: '1',
-            rate: 3,
-            slider: 50,
-            switch: true,
-            textarea: '这是一段文本',
-            date: '2021-08-01',
-            cascader: '1,1-1,1-1-1',
-            select: '1,2',
-            avatar: 'c84fb304c180f61bb7db40efef7f85b7',
-            color: '#000000',
-            ideCode: 'console.log("hello world")'
-        }
-    }
-
-    return (
-        <div
-            style={{
-                display: "grid",
-                gridTemplateColumns: "1fr 1fr",
-                gridRowGap: "10px",
-                gridColumnGap: "10px"
-            }}
-        >
-            <Button
-                onClick={async () => {
-                    const name = formInstance.getFieldValue(["user", "name"])
-                    message.success(name);
-                }}
-            >获取姓名</Button>
-
-            <Button
-                onClick={async () => {
-                    formInstance.setFieldValue(["user", "name"], "123")
-                }}
-            >设置姓名</Button>
-
-            <Button
-                onClick={async () => {
-                    await formInstance.validate();
-                }}
-            >验证表单</Button>
-
-            <Button
-                onClick={async () => {
-                    await formInstance.submit();
-                }}
-            >提交表单</Button>
-
-            <Button
-                onClick={async () => {
-                    const values = formInstance.getFieldsValue();
-                    message.success(JSON.stringify(values));
-                }}
-            >获取表单值</Button>
-
-            <Button
-                onClick={async () => {
-                    formInstance.reset();
-                }}
-            >重置表单</Button>
-
-            <Button
-                onClick={async () => {
-                    formInstance.setFieldsValue(data);
-                }}
-            >表单赋值</Button>
-            <div></div>
-
-            <Button
-                onClick={async () => {
-                    formInstance.enable(["user", "name"]);
-                }}
-            >启用姓名字段</Button>
-
-            <Button
-                onClick={async () => {
-                    formInstance.disable(["user", "name"]);
-                }}
-            >禁用姓名字段</Button>
-
-
-            <Button
-                onClick={async () => {
-                    formInstance.hidden(["user", "name"]);
-                }}
-            >隐藏姓名字段</Button>
-
-            <Button
-                onClick={async () => {
-                    formInstance.show(["user", "name"]);
-                }}
-            >展示姓名字段</Button>
-
-            <Button
-                onClick={async () => {
-                    formInstance.remove(["user", "name"]);
-                }}
-            >删除姓名字段</Button>
-
-            <Button
-                onClick={async () => {
-                    formInstance.create({
-                        props: {
-                            required: true,
-                            name: ['user', 'name'],
-                            label: '姓名',
-                            placeholder: '请输入姓名',
-                            validateFunction: async (content) => {
-                                const value = content.value;
-                                if (value) {
-                                    return []
-                                }
-                                return ['姓名不能为空']
-                            }
-                        },
-                        type: 'input'
-                    }, 0);
-                }}
-            >添加姓名字段</Button>
-
-        </div>
-    )
-}
-
-const FormPage = () => {
-    const leftFormInstance = Form.useForm();
-    const rightFormInstance = Form.useForm();
-
-    const fields = [
-        {
-            type: 'input',
-            props: {
-                required: true,
-                name: ['user', 'name'],
-                label: '姓名',
-                placeholder: '请输入姓名',
-                validateFunction: async (content) => {
-                    const value = content.value;
-                    if (value) {
-                        return []
-                    }
-                    return ['姓名不能为空']
-                }
-            }
-        },
-        {
-            type: 'stepper',
-            props: {
-                required: true,
-                name: ['user', 'age'],
-                label: '年龄',
-                placeholder: '请输入年龄',
-            }
-        },
-        {
-            type: 'password',
-            props: {
-                required: true,
-                name: ['user', 'password'],
-                label: '银行卡密码',
-                placeholder: '请输入银行卡密码',
-                validateFunction: async (content) => {
-                    const value = content.value;
-                    if (value) {
-                        return []
-                    }
-                    return ['银行卡密码不能为空']
-                }
-            }
-        },
-        {
-            type: 'captcha',
-            props: {
-                required: true,
-                name: ['user', 'code'],
-                label: '银行卡验证码',
-                placeholder: '请输入银行卡验证码',
-                onCaptchaRefresh: async () => {
-                    console.log('refresh captcha')
-                    return {
-                        url: '/captcha.jpeg',
-                        code: '123'
-                    }
-                }
-            }
-        },
-        {
-            type: 'checkbox',
-            props: {
-                required: true,
-                name: ['user', 'checkbox'],
-                label: '复选框',
-                options: [
-                    {label: '选项1', value: '1'},
-                    {label: '选项2', value: '2'},
-                    {label: '选项3', value: '3'},
-                ]
-            }
-        },
-        {
-            type: 'radio',
-            props: {
-                required: true,
-                name: ['user', 'radio'],
-                label: '单选框',
-                options: [
-                    {label: '选项1', value: '1'},
-                    {label: '选项2', value: '2'},
-                    {label: '选项3', value: '3'},
-                ]
-            }
-        },
-        {
-            type: 'rate',
-            props: {
-                required: true,
-                name: ['user', 'rate'],
-                label: '评分',
-            }
-        },
-        {
-            type: 'slider',
-            props: {
-                required: true,
-                name: ['user', 'slider'],
-                label: '滑块',
-                sliderPopover: true
-            }
-        },
-        {
-            type: 'switch',
-            props: {
-                required: true,
-                name: ['user', 'switch'],
-                label: '开关',
-            }
-        },
-        {
-            type: 'textarea',
-            props: {
-                required: true,
-                name: ['user', 'textarea'],
-                label: '文本域',
-            }
-        },
-        {
-            type: 'date',
-            props: {
-                required: true,
-                name: ['user', 'date'],
-                label: '日期',
-            }
-        },
-        {
-            type: 'cascader',
-            props: {
-                required: true,
-                name: ['user', 'cascader'],
-                label: '级联选择',
-                options: [
-                    {
-                        label: '选项1',
-                        value: '1',
-                        children: [
-                            {
-                                label: '选项1-1',
-                                value: '1-1',
-                                children: [
-                                    {
-                                        label: '选项1-1-1',
-                                        value: '1-1-1',
-                                    },
-                                    {
-                                        label: '选项1-1-2',
-                                        value: '1-1-2',
-                                    },
-                                ]
-                            },
-                            {
-                                label: '选项1-2',
-                                value: '1-2',
-                            },
-                        ]
-                    },
-                    {
-                        label: '选项2',
-                        value: '2',
-                        children: [
-                            {
-                                label: '选项2-1',
-                                value: '2-1',
-                            },
-                            {
-                                label: '选项2-2',
-                                value: '2-2',
-                            },
-                        ]
-                    },
-                ]
-            }
-        },
-        {
-            type: 'select',
-            props: {
-                required: true,
-                name: ['user', 'select'],
-                label: '选择器',
-                selectMultiple: true,
-                options: [
-                    {label: '选项1', value: '1'},
-                    {label: '选项2', value: '2'},
-                    {label: '选项3', value: '3'},
-                ]
-            }
-        },
-        {
-            type: 'uploader',
-            props: {
-                required: true,
-                name: ['user', 'avatar'],
-                label: '头像',
-            }
-        },
-        {
-            type: 'color',
-            props: {
-                required: true,
-                name: ['user', 'color'],
-                label: '颜色',
-            }
-        },
-        {
-            type: 'code',
-            props: {
-                required: true,
-                name: ['user', 'ideCode'],
-                label: '代码',
-            }
-        },
-    ] as FormField[];
-
-    return (
-        <PageContainer>
-            <Row gutter={[24, 24]}>
-                <Col span={12}>
-                    <Form
-                        form={leftFormInstance}
-                        layout={"horizontal"}
-                        footer={(
-                            <FooterButtons
-                                formInstance={leftFormInstance}
-                            />
-                        )}
-                    >
-                        <FormInput
-                            required={true}
-                            name={["user", "name"]}
-                            label={"姓名"}
-                            placeholder={"请输入姓名"}
-                            validateFunction={async (content) => {
-                                const value = content.value;
-                                if (value) {
-                                    return []
-                                }
-                                return ['姓名不能为空']
-                            }}
-                        />
-
-                        <FormStepper
-                            required={true}
-                            name={["user", "age"]}
-                            label={"年龄"}
-                            placeholder={"请输入年龄"}
-                        />
-
-                        <FormPassword
-                            required={true}
-                            name={["user", "password"]}
-                            label={"银行卡密码"}
-                            placeholder={"请输入银行卡密码"}
-                            validateFunction={async (content) => {
-                                const value = content.value;
-                                if (value) {
-                                    return []
-                                }
-                                return ['银行卡密码不能为空']
-                            }}
-                        />
-
-                        <FormCaptcha
-                            required={true}
-                            name={["user", "code"]}
-                            label={"银行卡验证码"}
-                            placeholder={"请输入银行卡验证码"}
-                            onCaptchaRefresh={async () => {
-                                console.log('refresh captcha')
-                                return {
-                                    url: '/captcha.jpeg',
-                                    code: '123'
-                                }
-                            }}
-                        />
-
-                        <FormCheckbox
-                            required={true}
-                            name={["user", "checkbox"]}
-                            label={"复选框"}
-                            options={[
-                                {label: '选项1', value: '1'},
-                                {label: '选项2', value: '2'},
-                                {label: '选项3', value: '3'},
-                            ]}
-                        />
-
-                        <FormRadio
-                            required={true}
-                            name={["user", "radio"]}
-                            label={"单选框"}
-                            options={[
-                                {label: '选项1', value: '1'},
-                                {label: '选项2', value: '2'},
-                                {label: '选项3', value: '3'},
-                            ]}
-                        />
-
-                        <FormRate
-                            required={true}
-                            name={["user", "rate"]}
-                            label={"评分"}
-                        />
-
-                        <FormSlider
-                            required={true}
-                            name={["user", "slider"]}
-                            label={"滑块"}
-                            sliderPopover={true}
-                        />
-
-                        <FormSwitch
-                            required={true}
-                            name={["user", "switch"]}
-                            label={"开关"}
-                        />
-
-                        <FormTextArea
-                            required={true}
-                            name={["user", "textarea"]}
-                            label={"文本域"}
-                        />
-
-                        <FormDate
-                            required={true}
-                            name={["user", "date"]}
-                            label={"日期"}
-                        />
-
-                        <FormCascader
-                            required={true}
-                            name={["user", "cascader"]}
-                            label={"级联选择"}
-                            options={[
-                                {
-                                    label: '选项1',
-                                    value: '1',
-                                    children: [
-                                        {
-                                            label: '选项1-1',
-                                            value: '1-1',
-                                            children: [
-                                                {
-                                                    label: '选项1-1-1',
-                                                    value: '1-1-1',
-                                                },
-                                                {
-                                                    label: '选项1-1-2',
-                                                    value: '1-1-2',
-                                                },
-                                            ]
-                                        },
-                                        {
-                                            label: '选项1-2',
-                                            value: '1-2',
-                                        },
-                                    ]
-                                },
-                                {
-                                    label: '选项2',
-                                    value: '2',
-                                    children: [
-                                        {
-                                            label: '选项2-1',
-                                            value: '2-1',
-                                        },
-                                        {
-                                            label: '选项2-2',
-                                            value: '2-2',
-                                        },
-                                    ]
-                                },
-                            ]}
-                        />
-
-                        <FormSelect
-                            required={true}
-                            name={["user", "select"]}
-                            label={"选择器"}
-                            selectMultiple={true}
-                            options={[
-                                {label: '选项1', value: '1'},
-                                {label: '选项2', value: '2'},
-                                {label: '选项3', value: '3'},
-                            ]}
-                        />
-
-                        <FormUploader
-                            required={true}
-                            name={["user", "avatar"]}
-                            label={"头像"}
-                        />
-
-                        <FormColor
-                            required={true}
-                            name={["user", "color"]}
-                            label={"颜色"}
-                        />
-
-                        <FormCode
-                            required={true}
-                            name={["user", "ideCode"]}
-                            label={"代码"}
-                        />
-                    </Form>
-                </Col>
-
-                <Col span={12}>
-                    <Form
-                        form={rightFormInstance}
-                        footer={(
-                            <FooterButtons
-                                formInstance={rightFormInstance}
-                            />
-                        )}
-                        loadFields={async () => {
-                            return fields;
-                        }}
-                    >
-                    </Form>
-                </Col>
-            </Row>
-
-        </PageContainer>
-    );
-}
-
-export default FormPage;
diff --git a/admin-pro-ui/src/pages/login/index.tsx b/admin-pro-ui/src/pages/login/index.tsx
deleted file mode 100644
index b56087c4..00000000
--- a/admin-pro-ui/src/pages/login/index.tsx
+++ /dev/null
@@ -1,159 +0,0 @@
-import {LockOutlined, UserOutlined,} from '@ant-design/icons';
-import {
-    LoginForm,
-    ModalForm,
-    ProForm,
-    ProFormCheckbox,
-    ProFormText,
-    ProFormTextArea,
-} from '@ant-design/pro-components';
-import {initUser, login} from "@/api/account";
-import {useNavigate} from "react-router";
-import {useEffect, useState} from "react";
-import {useDispatch} from "react-redux";
-import {refresh} from '@/store/MenuSlice';
-import {config} from "@/config/theme";
-import {message} from "antd";
-
-const loginPage = () => {
-    const navigate = useNavigate();
-    const [form] = ProForm.useForm();
-
-    const [visible, setVisible] = useState<boolean>(false);
-    const dispatch = useDispatch();
-
-    useEffect(() => {
-
-        const isMemory = localStorage.getItem('l-isMemory');
-        if (isMemory === 'true') {
-            const username = localStorage.getItem('l-username');
-            const password = localStorage.getItem('l-password');
-            form.setFieldsValue({
-                username: username,
-                password: password,
-                isMemory: true,
-            });
-        } else {
-            form.setFieldsValue({
-                isMemory: false,
-            });
-        }
-    }, []);
-
-    return (
-        <>
-            <LoginForm
-                logo="logo.png"
-                title="Admin UI"
-                subTitle="Antd Admin UI Platform"
-                form={form}
-                onFinish={async (values) => {
-                    const res = await login(values);
-                    if (res.success) {
-                        // 初始化用户信息
-                        initUser(res.data);
-                        // 重新加载菜单
-                        dispatch(refresh());
-                        // 跳转到欢迎页
-                        navigate(config.welcomePath);
-
-                        localStorage.setItem('l-isMemory', values.isMemory);
-                        if (values.isMemory) {
-                            localStorage.setItem('l-username', values.username);
-                            localStorage.setItem('l-password', values.password);
-                        } else {
-                            localStorage.removeItem('l-username');
-                            localStorage.removeItem('l-password');
-                        }
-                    }else{
-                        message.error('登录失败，请检查用户名和密码！');
-                    }
-                }}
-            >
-                <>
-                    <ProFormText
-                        name="username"
-                        fieldProps={{
-                            size: 'large',
-                            prefix: <UserOutlined className={'prefixIcon'}/>,
-                        }}
-                        placeholder={'用户名: admin'}
-                        rules={[
-                            {
-                                required: true,
-                                message: '请输入用户名!',
-                            },
-                        ]}
-                    />
-                    <ProFormText.Password
-                        name="password"
-                        fieldProps={{
-                            size: 'large',
-                            prefix: <LockOutlined className={'prefixIcon'}/>,
-                        }}
-                        placeholder={'密码: admin'}
-                        rules={[
-                            {
-                                required: true,
-                                message: '请输入密码！',
-                            },
-                        ]}
-                    />
-                </>
-                <div
-                    style={{
-                        marginBlockEnd: 24,
-                    }}
-                >
-                    <ProFormCheckbox noStyle name="isMemory">
-                        记住密码
-                    </ProFormCheckbox>
-
-                    <a
-                        style={{
-                            float: 'right',
-                            marginBottom: 10,
-                        }}
-                        onClick={() => {
-                            setVisible(true);
-                        }}
-                    >忘记密码？</a>
-                </div>
-            </LoginForm>
-
-
-            <ModalForm
-                title="忘记管理员密码?"
-                open={visible}
-                modalProps={{
-                    destroyOnClose: true,
-                    onCancel: () => {
-                        setVisible(false);
-                    }
-                }}
-                onFinish={async (values) => {
-
-                }}
-            >
-                <ProFormTextArea
-                    name="code"
-                    label="请输入运维口令"
-                    fieldProps={{
-                        rows: 6,
-                    }}
-                    placeholder="请输入运维口令"
-                    rules={[
-                        {
-                            required: true,
-                            message: '运维口令是必填项！',
-                        },
-                    ]}
-                />
-
-            </ModalForm>
-        </>
-    );
-};
-
-
-export default loginPage;
diff --git a/admin-pro-ui/src/pages/welcome/index.scss b/admin-pro-ui/src/pages/welcome/index.scss
deleted file mode 100644
index c3ef6dd0..00000000
--- a/admin-pro-ui/src/pages/welcome/index.scss
+++ /dev/null
@@ -1,36 +0,0 @@
-.App {
-  text-align: center;
-}
-
-.App-logo {
-  height: 40vmin;
-  pointer-events: none;
-}
-
-@media (prefers-reduced-motion: no-preference) {
-  .App-logo {
-    animation: App-logo-spin infinite 20s linear;
-  }
-}
-
-.App-header {
-  min-height: 100vh;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  font-size: calc(10px + 2vmin);
-}
-
-.App-link {
-}
-
-@keyframes App-logo-spin {
-  from {
-    transform: rotate(0deg);
-  }
-  to {
-    transform: rotate(360deg);
-  }
-}
-
diff --git a/admin-pro-ui/src/pages/welcome/index.tsx b/admin-pro-ui/src/pages/welcome/index.tsx
deleted file mode 100644
index 5bf4fca0..00000000
--- a/admin-pro-ui/src/pages/welcome/index.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import React from 'react';
-import {PageContainer} from "@ant-design/pro-components";
-import './index.scss';
-
-
-const WelcomePage = () => {
-
-    return (
-        <PageContainer>
-
-            <ul>Admin-UI 支持的功能有</ul>
-            <ul>1. 自定义流程</ul>
-            <ul>2. 表单渲染</ul>
-            <ul>3. 管理权限</ul>
-            <ul>4. 动态菜单</ul>
-            <ul>5. 动态加载组件</ul>
-        </PageContainer>
-    );
-}
-
-export default WelcomePage;
diff --git a/admin-pro-ui/src/react-app-env.d.ts b/admin-pro-ui/src/react-app-env.d.ts
deleted file mode 100644
index 6431bc5f..00000000
--- a/admin-pro-ui/src/react-app-env.d.ts
+++ /dev/null
@@ -1 +0,0 @@
-/// <reference types="react-scripts" />
diff --git a/admin-pro-ui/src/reportWebVitals.ts b/admin-pro-ui/src/reportWebVitals.ts
deleted file mode 100644
index 49a2a16e..00000000
--- a/admin-pro-ui/src/reportWebVitals.ts
+++ /dev/null
@@ -1,15 +0,0 @@
-import { ReportHandler } from 'web-vitals';
-
-const reportWebVitals = (onPerfEntry?: ReportHandler) => {
-  if (onPerfEntry && onPerfEntry instanceof Function) {
-    import('web-vitals').then(({ getCLS, getFID, getFCP, getLCP, getTTFB }) => {
-      getCLS(onPerfEntry);
-      getFID(onPerfEntry);
-      getFCP(onPerfEntry);
-      getLCP(onPerfEntry);
-      getTTFB(onPerfEntry);
-    });
-  }
-};
-
-export default reportWebVitals;
diff --git a/admin-pro-ui/src/store/CounterSlice.ts b/admin-pro-ui/src/store/CounterSlice.ts
deleted file mode 100644
index 9c0f799a..00000000
--- a/admin-pro-ui/src/store/CounterSlice.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-import {createSlice} from '@reduxjs/toolkit';
-
-export interface CounterStore {
-    value: number;
-}
-
-export type CounterStoreAction = {
-    increment: (state: CounterStore) => void;
-    decrement: (state: CounterStore) => void;
-    clear: (state: CounterStore) => void;
-}
-
-export const counterSlice = createSlice<CounterStore, CounterStoreAction, "counter", {}>({
-    name: 'counter',
-    initialState: {
-        value: 0,
-    },
-    reducers: {
-        increment: (state) => {
-            state.value += 1;
-        },
-        decrement: (state) => {
-            state.value -= 1;
-        },
-        clear: (state) => {
-            state.value = 0;
-        },
-    },
-});
-
-export const {increment, decrement, clear} = counterSlice.actions;
-
diff --git a/admin-pro-ui/src/store/MenuSlice.ts b/admin-pro-ui/src/store/MenuSlice.ts
deleted file mode 100644
index 589fe074..00000000
--- a/admin-pro-ui/src/store/MenuSlice.ts
+++ /dev/null
@@ -1,24 +0,0 @@
-import {createSlice} from '@reduxjs/toolkit';
-
-export interface MenuStore {
-    version: number;
-}
-
-export type MenuStoreAction = {
-    refresh: (state: MenuStore) => void;
-}
-
-export const menuSlice = createSlice<MenuStore, MenuStoreAction, "menu", {}>({
-    name: 'menu',
-    initialState: {
-        version: 0,
-    },
-    reducers: {
-        refresh: (state) => {
-            state.version = Math.random();
-        },
-    },
-});
-
-export const {refresh} = menuSlice.actions;
-
diff --git a/admin-pro-ui/src/store/Redux.tsx b/admin-pro-ui/src/store/Redux.tsx
deleted file mode 100644
index 6e97990b..00000000
--- a/admin-pro-ui/src/store/Redux.tsx
+++ /dev/null
@@ -1,13 +0,0 @@
-import {configureStore} from '@reduxjs/toolkit';
-import {counterSlice} from './CounterSlice';
-import {menuSlice} from './MenuSlice';
-
-const store = configureStore({
-    reducer: {
-        counter: counterSlice.reducer,
-        menu: menuSlice.reducer,
-    },
-});
-
-export type RootState = ReturnType<typeof store.getState>;
-export default store;
\ No newline at end of file
diff --git a/admin-pro-ui/src/utils/RoleControl.ts b/admin-pro-ui/src/utils/RoleControl.ts
deleted file mode 100644
index 110316de..00000000
--- a/admin-pro-ui/src/utils/RoleControl.ts
+++ /dev/null
@@ -1,92 +0,0 @@
-class RoleControl {
-
-
-    /**
-     * 存在所有角色
-     * @param roles 角色列表
-     */
-    static hasRoles(roles: string[]): boolean {
-        const authentications = this.roles();
-        if (authentications) {
-            for (let i = 0; i < roles.length; i++) {
-                if (authentications.indexOf(roles[i]) === -1) {
-                    return false;
-                }
-            }
-        }
-        return true;
-    }
-
-    /**
-     * 存在任意角色
-     * @param roles 角色列表
-     */
-    static anyRoles(roles: string[]): boolean {
-        const authentications = this.roles();
-        if (authentications) {
-            for (let i = 0; i < roles.length; i++) {
-                if (authentications.indexOf(roles[i]) !== -1) {
-                    return true;
-                }
-            }
-        }
-        return false;
-    }
-
-
-    /**
-     * 不存在角色
-     * @param roles 角色列表
-     */
-    static notHasRoles(roles: string[]): boolean {
-        const authentications = this.roles();
-        if (authentications) {
-            for (let i = 0; i < roles.length; i++) {
-                if (authentications.indexOf(roles[i]) !== -1) {
-                    return false;
-                }
-            }
-        }
-        return true;
-    }
-
-    /**
-     * 不存在任意角色
-     * @param roles 角色列表
-     */
-    static notAnyRoles(roles: string[]): boolean {
-        const authentications = this.roles();
-        if (authentications) {
-            for (let i = 0; i < roles.length; i++) {
-                if (authentications.indexOf(roles[i]) === -1) {
-                    return true;
-                }
-            }
-        }
-        return false;
-    }
-
-    /**
-     * 获取角色列表
-     */
-    static roles(): string[] {
-        const authorities = localStorage.getItem('authorities');
-        if (authorities !== null && authorities !== undefined && authorities !== '' && authorities !== 'undefined') {
-            return JSON.parse(authorities as string);
-        } else {
-            return [];
-        }
-    }
-
-    /**
-     * 不存在任何角色
-     */
-    static isNotRoles(): boolean {
-        return this.roles().length === 0;
-    }
-
-
-}
-
-
-export default RoleControl;
diff --git a/admin-pro-ui/src/utils/base64.ts b/admin-pro-ui/src/utils/base64.ts
deleted file mode 100644
index 3b8c68da..00000000
--- a/admin-pro-ui/src/utils/base64.ts
+++ /dev/null
@@ -1,28 +0,0 @@
-import {RcFile} from "antd/es/upload";
-
-export const rcFileToBase64 = (file: RcFile): Promise<string> => {
-    return new Promise((resolve, reject) => {
-        const reader = new FileReader();
-        reader.readAsDataURL(file);
-        reader.onload = () => resolve(reader.result as string);
-        reader.onerror = error => reject(error);
-    });
-}
-
-
-export const base64ToBlob = (base64: string, type: string) => {
-    const binStr = atob(base64.split(',')[1]);
-    const len = binStr.length;
-    const arr = new Uint8Array(len);
-    for (let i = 0; i < len; i++) {
-        arr[i] = binStr.charCodeAt(i);
-    }
-    return new Blob([arr], {type: type});
-}
-
-export const base64ToString = (base64: string) => {
-    if (base64.indexOf('base64') !== -1) {
-        base64 = base64.split(',')[1];
-    }
-    return atob(base64);
-}
diff --git a/admin-pro-ui/src/utils/dynamicLoader.ts b/admin-pro-ui/src/utils/dynamicLoader.ts
deleted file mode 100644
index f5a44637..00000000
--- a/admin-pro-ui/src/utils/dynamicLoader.ts
+++ /dev/null
@@ -1,108 +0,0 @@
-import JSZip from "jszip";
-import {base64ToBlob} from "@/utils/base64";
-
-export const loadRemoteComponent = (scope: string, module: string) => {
-    return new Promise(async (resolve, reject) => {
-        try {
-            // Initialize the sharing scope (shared modules like react, etc.)
-            //@ts-ignore
-            await __webpack_init_sharing__('default');
-            //@ts-ignore
-            const container = window[scope]; // Get the container loaded on the window object
-            if (!container) {
-                reject(new Error(`Remote scope ${scope} not found on window.`));
-                return;
-            }
-
-            //@ts-ignore
-            await container.init(__webpack_share_scopes__.default); // Initialize the container
-            const factory = await container.get(module); // Get the module factory
-            resolve(factory()); // Get the actual module
-        } catch (e) {
-            reject(e);
-        }
-    });
-};
-
-export const loadRemoteScript = (url: string): Promise<void> => {
-    return new Promise((resolve, reject) => {
-        try {
-            const script = document.createElement('script');
-            script.src = url;
-            script.onload = (e) => {
-                resolve();
-            };
-            script.onerror = reject;
-            document.head.appendChild(script);
-        } catch (e) {
-            reject(e);
-        }
-    });
-};
-
-
-export const loadFileScript = (content: string): Promise<void> => {
-    return new Promise((resolve, reject) => {
-        try {
-            try {
-                eval(content);
-            } catch (e) {
-                resolve();
-                return;
-            }
-            const encoder = new TextEncoder();
-            const encodedContent = encoder.encode(content);
-            const blob = new Blob([encodedContent], {type: 'application/javascript'});
-            const url = URL.createObjectURL(blob);
-            const script = document.createElement('script');
-            script.src = url;
-            script.onload = () => {
-                resolve();
-            };
-            script.onerror = (e) => {
-                reject(e);
-            };
-            document.head.appendChild(script);
-        } catch (e) {
-            reject(e);
-        }
-    });
-};
-
-
-export const loadZipJsFileScript = async (base64: string): Promise<void> => {
-    return new Promise((resolve, reject) => {
-        const file = base64ToBlob(base64, 'application/zip');
-        if (file) {
-            const zip = new JSZip();
-            const content = file.arrayBuffer();
-            zip.loadAsync(content).then((unzipped) => {
-                const jsFiles: { relativePath: string, content: string }[] = [];
-
-                const filePromises: Promise<void>[] = [];
-                unzipped.forEach((relativePath, file) => {
-                    if (relativePath.endsWith(".js")) {
-                        const filePromise = file.async('text').then((text) => {
-                            jsFiles.push({relativePath, content: text});
-                        });
-                        filePromises.push(filePromise);
-                    }
-                });
-
-                Promise.all(filePromises).then(() => {
-                    jsFiles.reduce((prevPromise: any, jsFile) => {
-                        return prevPromise.then(() => {
-                            return loadFileScript(jsFile.content).then(() => {
-                                console.log('Load success file:', jsFile.relativePath);
-                            });
-                        });
-                    }, Promise.resolve()).then(() => {
-                        resolve();
-                    }).catch(reject);
-                }).catch(reject);
-            }).catch(reject);
-        } else {
-            reject(new Error('Failed to convert base64 to Blob.'));
-        }
-    });
-};
diff --git a/admin-pro-ui/src/utils/index.ts b/admin-pro-ui/src/utils/index.ts
deleted file mode 100644
index 68cdba5c..00000000
--- a/admin-pro-ui/src/utils/index.ts
+++ /dev/null
@@ -1,16 +0,0 @@
-import {fromByteArray} from "base64-js";
-
-export const sleep = async (time: number) => {
-    return new Promise((resolve:any) => {
-        setTimeout(() => {
-            resolve();
-        }, time);
-    })
-}
-
-
-export const textToBase64 = (text: any) => {
-    const encoder = new TextEncoder();
-    const urlArray = encoder.encode(JSON.stringify(text));
-    return fromByteArray(urlArray);
-}
diff --git a/admin-pro-ui/tsconfig.json b/admin-pro-ui/tsconfig.json
deleted file mode 100644
index 3065bb9a..00000000
--- a/admin-pro-ui/tsconfig.json
+++ /dev/null
@@ -1,30 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "es5",
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
-    "allowJs": true,
-    "skipLibCheck": true,
-    "esModuleInterop": true,
-    "allowSyntheticDefaultImports": true,
-    "strict": true,
-    "forceConsistentCasingInFileNames": true,
-    "noFallthroughCasesInSwitch": true,
-    "module": "esnext",
-    "moduleResolution": "node",
-    "resolveJsonModule": true,
-    "isolatedModules": true,
-    "noEmit": false,
-    "jsx": "react-jsx",
-    "baseUrl": ".",
-    "paths": {
-      "@/*": ["src/*"]
-    }
-  },
-  "include": [
-    "src"
-  ]
-}
diff --git a/admin-pro-ui/webpack.common.js b/admin-pro-ui/webpack.common.js
deleted file mode 100644
index 061d285a..00000000
--- a/admin-pro-ui/webpack.common.js
+++ /dev/null
@@ -1,96 +0,0 @@
-const path = require('path');
-const HtmlWebpackPlugin = require('html-webpack-plugin');
-const CopyWebpackPlugin = require('copy-webpack-plugin');
-const {CleanWebpackPlugin} = require('clean-webpack-plugin');
-const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin');
-const ModuleFederationPlugin = require("webpack/lib/container/ModuleFederationPlugin");
-const {dependencies} = require("./package.json");
-
-module.exports = {
-    entry: './src/index.tsx',
-    ignoreWarnings: [
-        {
-            module: /@babel\/standalone/, // 忽略来自 @babel/standalone 的警告
-            message: /Critical dependency: the request of a dependency is an expression/,
-        },
-    ],
-    devServer: {
-        port: 3000,
-    },
-    resolve: {
-        extensions: ['.ts', '.tsx', '.js'],
-        alias: {
-            '@': path.resolve(__dirname, 'src'),
-        },
-    },
-    module: {
-        rules: [
-            {
-                test: /\.tsx?$/,
-                use: 'ts-loader',
-                exclude: /node_modules/,
-            },
-            {
-                test: /\.(css|s[ac]ss)$/,  // 匹配 .css, .scss, .sass 文件
-                use: [
-                    'style-loader',  // 将 CSS 插入到 DOM 中
-                    'css-loader',    // 解析 CSS
-                    'sass-loader',   // 解析 Sass 文件（对于 .scss 和 .sass 文件）
-                ],
-            },
-            {
-                test: /\.(png|jpg|gif|svg)$/,
-                type: 'asset/resource',
-            },
-            // 使用 'asset/inline' 将图片转为 JS 模块
-            // {
-            //     test: /\.(png|jpg|gif|svg)$/,
-            //     type: 'asset/inline',  // 使用 'asset/inline' 将图片转为 JS 模块
-            //     parser: {
-            //         dataUrlCondition: {
-            //             maxSize: 100 * 1024,  // 超过100KB的图片将不会转为内联
-            //         },
-            //     },
-            // },
-        ],
-    },
-    plugins: [
-        new CleanWebpackPlugin(),
-        new MonacoWebpackPlugin(),
-        new HtmlWebpackPlugin({
-            template: './public/index.html',
-        }),
-        new CopyWebpackPlugin({
-            patterns: [
-                {
-                    from: 'public',
-                    to: '.',
-                    globOptions: {
-                        ignore: ['**/index.html'],
-                    },
-                }
-            ],
-        }),
-        new ModuleFederationPlugin({
-            name: dependencies["name"],
-
-            shared: {
-                // some other dependencies
-                react: { // react
-                    singleton: true,
-                    requiredVersion: dependencies["react"],
-                    eager: true,
-                },
-                "react-dom": { // react-dom
-                    singleton: true,
-                    requiredVersion: dependencies["react-dom"],
-                    eager: true,
-                },
-            },
-        }),
-    ],
-    output: {
-        filename: 'bundle.js',
-        path: path.resolve(__dirname, 'dist'),
-    },
-};
diff --git a/admin-pro-ui/webpack.config.dev.js b/admin-pro-ui/webpack.config.dev.js
deleted file mode 100644
index 2ac3919e..00000000
--- a/admin-pro-ui/webpack.config.dev.js
+++ /dev/null
@@ -1,21 +0,0 @@
-const {merge} = require('webpack-merge');
-const common = require('./webpack.common.js');
-
-module.exports = merge(common, {
-    mode: 'development',
-    devServer: {
-        port: 8000,
-
-        proxy: [
-            {
-                context: ['/api','/open','/user'],
-                target: 'http://127.0.0.1:8090',
-                changeOrigin: true,
-                logLevel: 'debug',
-                onProxyReq: (proxyReq, req, res) => {
-                    console.log('Proxying request:', req.url);
-                },
-            }
-        ]
-    }
-});
diff --git a/admin-pro-ui/webpack.config.mock.js b/admin-pro-ui/webpack.config.mock.js
deleted file mode 100644
index 1998dc09..00000000
--- a/admin-pro-ui/webpack.config.mock.js
+++ /dev/null
@@ -1,27 +0,0 @@
-const {merge} = require('webpack-merge');
-const common = require('./webpack.common.js');
-const webpackMockServer = require('webpack-mock-server');
-const mockFunction = require('./mocks/index.js');
-const express = require('express');
-
-module.exports = merge(common, {
-    mode: 'development',
-    devServer: {
-        port: 8000,
-
-        setupMiddlewares: (middlewares, devServer) => {
-            if (!devServer) {
-                throw new Error('webpack-dev-server is not defined');
-            }
-            // 使用 express.json() 来解析请求体
-            devServer.app.use(express.json());
-
-            // 使用 webpackMockServer 来添加 mock 功能
-            webpackMockServer.use(devServer.app);
-            webpackMockServer.add(mockFunction)(devServer.app);
-
-            console.log('mock server is running');
-            return middlewares; // 返回 middlewares
-        }
-    },
-});
diff --git a/admin-pro-ui/webpack.config.prod.js b/admin-pro-ui/webpack.config.prod.js
deleted file mode 100644
index 3e2d47c5..00000000
--- a/admin-pro-ui/webpack.config.prod.js
+++ /dev/null
@@ -1,9 +0,0 @@
-const {merge} = require('webpack-merge');
-const common = require('./webpack.common.js');
-
-module.exports = merge(common,{
-    mode: 'production',
-    devServer: {
-        port: 8000,
-    },
-});
diff --git a/admin-ui/package.json b/admin-ui/package.json
index ec428499..7f33c151 100644
--- a/admin-ui/package.json
+++ b/admin-ui/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "admin-ui",
+  "name": "admin-pro-ui",
   "version": "0.1.0",
   "private": true,
   "dependencies": {
@@ -7,6 +7,9 @@
     "@ant-design/icons": "^5.4.0",
     "@ant-design/pro-components": "^2.8.2",
     "@babel/standalone": "^7.25.6",
+    "@codingapi/flow-pc": "^0.0.8",
+    "@codingapi/form-pc": "^0.0.16",
+    "@codingapi/ui-framework": "^0.0.12",
     "@dnd-kit/core": "^6.2.0",
     "@dnd-kit/sortable": "^9.0.0",
     "@handsontable/react-wrapper": "^15.0.0",
@@ -25,12 +28,13 @@
     "jszip": "^3.10.1",
     "lodash": "^4.17.21",
     "moment": "^2.30.1",
-    "monaco-editor": "^0.51.0",
     "react": "^18.3.1",
     "react-dom": "^18.3.1",
+    "react-markdown": "^10.0.0",
     "react-redux": "^9.1.2",
     "react-router": "^6.26.2",
     "react-router-dom": "^6.26.2",
+    "remark-gfm": "^4.0.1",
     "typescript": "^5.6.2",
     "web-vitals": "^2.1.4"
   },
diff --git a/admin-pro-ui/public/captcha.jpeg b/admin-ui/public/captcha.jpeg
similarity index 100%
rename from admin-pro-ui/public/captcha.jpeg
rename to admin-ui/public/captcha.jpeg
diff --git a/admin-ui/public/index.html b/admin-ui/public/index.html
index b7c72ebf..12f184e0 100644
--- a/admin-ui/public/index.html
+++ b/admin-ui/public/index.html
@@ -17,7 +17,7 @@
       work correctly both with client-side routing and a non-root public URL.
       Learn how to configure a non-root public URL by running `npm run build`.
     -->
-    <title>Admin UI</title>
+    <title>Admin-Pro UI</title>
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
diff --git a/admin-ui/src/api/account.ts b/admin-ui/src/api/account.ts
index 2f146a05..d2efb1ec 100644
--- a/admin-ui/src/api/account.ts
+++ b/admin-ui/src/api/account.ts
@@ -1,9 +1,14 @@
-import {post} from "@/api/index";
+import {get, post} from "@/api/index";
 
 export async function login(body: Account.LoginRequest) {
     return post('/user/login', body);
 }
 
+export async function captcha() {
+    return get('/open/captcha');
+}
+
+
 export function clearUser() {
     localStorage.removeItem('username');
     localStorage.removeItem('token');
@@ -24,4 +29,4 @@ export function initUser(user: {
         localStorage.setItem('authorities', JSON.stringify(authorities));
     }
     localStorage.setItem('avatar', avatar || "/logo.png");
-}
\ No newline at end of file
+}
diff --git a/admin-pro-ui/src/api/oss.ts b/admin-ui/src/api/oss.ts
similarity index 100%
rename from admin-pro-ui/src/api/oss.ts
rename to admin-ui/src/api/oss.ts
diff --git a/admin-ui/src/components/CodeEditor/index.tsx b/admin-ui/src/components/CodeEditor/index.tsx
deleted file mode 100644
index a56e9ee5..00000000
--- a/admin-ui/src/components/CodeEditor/index.tsx
+++ /dev/null
@@ -1,117 +0,0 @@
-import React, {Ref, useEffect, useImperativeHandle} from 'react';
-import * as monaco from 'monaco-editor';
-
-export interface CodeEditorActionType {
-    resetValue: (value: string) => void;
-    getSelectedValue: () => string;
-    getValue:()=>string;
-}
-
-export interface CodeEditorProps {
-    language?: string,
-    value?: string,
-    onChange?: (value: string) => void,
-    onSelectedRun?: (value: string) => void;
-    style?: React.CSSProperties;
-    readonly?:boolean;
-    theme?:string;
-    actionRef?: Ref<CodeEditorActionType|undefined>;
-}
-
-const CodeEditor: React.FC<CodeEditorProps> = (props) => {
-    const language = props.language || 'sql';
-
-    const actionRef = props.actionRef;
-
-    const container = React.useRef(null);
-
-    const style = props.style || {
-        height: "80px",
-    }
-
-    if(actionRef) {
-        useImperativeHandle(actionRef, () => ({
-            resetValue: (value: string) => {
-                const editors = monaco.editor.getEditors();
-                if(editors.length>0){
-                    const editor = editors[0];
-                    editor.setValue(value);
-                }
-            },
-            getSelectedValue: () => {
-                const editors = monaco.editor.getEditors();
-                if (editors.length > 0) {
-                    const editor = editors[0];
-                    const selection = editor.getSelection();
-                    //@ts-ignore
-                    return editor.getModel().getValueInRange(selection);
-                }
-                return "";
-            },
-            getValue:()=>{
-                const editors = monaco.editor.getEditors();
-                if (editors.length > 0) {
-                    const editor = editors[0];
-                    return editor.getValue();
-                }
-                return "";
-            }
-        }), []);
-    }
-
-    useEffect(() => {
-        const model = monaco.editor.createModel(props.value || "", language);
-        const theme = props.theme || "vs-dark";
-        const editor = monaco.editor.create(
-            //@ts-ignore
-            container?.current,
-            {
-                automaticLayout: true,
-                model: model,
-                fontSize: 14,
-                theme: theme,
-                readOnly: props.readonly,
-            },
-        );
-
-        const subscription = editor.onDidChangeModelContent((event) => {
-            props.onChange && props.onChange(editor.getValue());
-        });
-
-        let runSelectedCodeActionDispose: monaco.IDisposable | null = null;
-        if(props.onSelectedRun) {
-            const runSelectedCodeAction = {
-                id: "run-code",
-                label: "Run Selected Code",
-                contextMenuGroupId: "navigation",
-                keybindings: [
-                    monaco.KeyMod.CtrlCmd | monaco.KeyCode.KeyR,
-                    monaco.KeyMod.WinCtrl | monaco.KeyCode.KeyR,
-                ],
-                run: () => {
-                    const selection = editor.getSelection();
-                    //@ts-ignore
-                    const selectedText = editor.getModel().getValueInRange(selection);
-                    props.onSelectedRun && props.onSelectedRun(selectedText);
-                },
-            }
-            runSelectedCodeActionDispose = monaco.editor.addEditorAction(runSelectedCodeAction);
-        }
-
-        return () => {
-            editor.dispose();
-            subscription.dispose();
-            model.dispose();
-
-            if(runSelectedCodeActionDispose!==null){
-                runSelectedCodeActionDispose.dispose();
-            }
-        };
-    }, [props.readonly]);
-
-    return (
-        <div ref={container} style={style}></div>
-    );
-};
-
-export default CodeEditor;
diff --git a/admin-ui/src/components/Flow/components/PostponedFormView.tsx b/admin-ui/src/components/Flow/components/PostponedFormView.tsx
deleted file mode 100644
index 4aa9cf4c..00000000
--- a/admin-ui/src/components/Flow/components/PostponedFormView.tsx
+++ /dev/null
@@ -1,41 +0,0 @@
-import React from "react";
-import {ModalForm, ProFormDigit} from "@ant-design/pro-components";
-import {PostponedFormProps} from "@/components/Flow/flow/types";
-
-
-const PostponedFormView:React.FC<PostponedFormProps> = (props)=>{
-
-    return (
-        <ModalForm
-            title={"延期调整"}
-            open={props.visible}
-            modalProps={{
-                onCancel: () => {
-                    props.setVisible(false);
-                },
-                onClose: () => {
-                    props.setVisible(false);
-                },
-                destroyOnClose:true,
-            }}
-            onFinish={async (values) => {
-                props.onFinish(values);
-            }}
-        >
-            <ProFormDigit
-                name={"hours"}
-                label={"延期时间"}
-                tooltip={"以当前时间开始延期，延期单位为小时"}
-                addonAfter={"小时"}
-                rules={[
-                    {
-                        required: true,
-                        message: "请输入延期时间"
-                    }
-                ]}
-            />
-        </ModalForm>
-    )
-}
-
-export default PostponedFormView;
diff --git a/admin-ui/src/components/Flow/components/ResultFormView.tsx b/admin-ui/src/components/Flow/components/ResultFormView.tsx
deleted file mode 100644
index e593be63..00000000
--- a/admin-ui/src/components/Flow/components/ResultFormView.tsx
+++ /dev/null
@@ -1,76 +0,0 @@
-import React from 'react';
-import {Modal, Result} from "antd";
-import {ProDescriptions} from "@ant-design/pro-components";
-import {FlowResultItem, ResultFormProps} from "@/components/Flow/flow/types";
-
-
-const ResultFormView: React.FC<ResultFormProps> = (props) => {
-    const {result} = props;
-
-    if (!result) {
-        return null;
-    }
-
-    const resultStateTag = ()=>{
-        const resultState = result.resultState;
-        if(resultState === "SUCCESS") {
-            return "success"
-        }
-        if(resultState === "WARNING") {
-            return "warning"
-        }
-        return "info";
-    };
-
-
-    return (
-        <Modal
-            width={"40%"}
-            height={"60%"}
-            open={props.visible}
-            onCancel={() => {
-                props.setVisible(false);
-                if (props.flowCloseable) {
-                    props.closeFlow();
-                }
-            }}
-            onClose={() => {
-                props.setVisible(false);
-                if (props.flowCloseable) {
-                    props.closeFlow();
-                }
-            }}
-            onOk={() => {
-                props.setVisible(false);
-                if (props.flowCloseable) {
-                    props.closeFlow();
-                }
-            }}
-            destroyOnClose={true}
-        >
-
-            <Result
-                status={resultStateTag()}
-                title={result.title}
-            >
-                {result.items && result.items.map((item: FlowResultItem, index: number) => {
-                    return (
-                        <ProDescriptions
-                            column={2}
-                        >
-                            <ProDescriptions.Item
-                                span={2}
-                                label={item.label}
-                                valueType="text"
-                            >
-                                {item.value}
-                            </ProDescriptions.Item>
-                        </ProDescriptions>
-                    )
-                })}
-            </Result>
-        </Modal>
-    )
-}
-
-export default ResultFormView;
diff --git a/admin-ui/src/components/Flow/components/UserSelectView.tsx b/admin-ui/src/components/Flow/components/UserSelectView.tsx
deleted file mode 100644
index d7e130b8..00000000
--- a/admin-ui/src/components/Flow/components/UserSelectView.tsx
+++ /dev/null
@@ -1,66 +0,0 @@
-import React, {useEffect} from "react";
-import {UserSelectProps} from "@/components/Flow/flow/types";
-import {ModalForm, ProForm, ProFormSelect} from "@ant-design/pro-components";
-import {users} from "@/api/user";
-
-
-const UserSelectView: React.FC<UserSelectProps> = (props) => {
-
-    const [form] = ProForm.useForm();
-
-    const [userList, setUserList] = React.useState<any[]>([]);
-
-    useEffect(() => {
-        users().then((res) => {
-            if (res.success) {
-                const list = res.data.list.filter((item:any)=>{
-                    const specifyUserIds = props.specifyUserIds;
-                    if(specifyUserIds && specifyUserIds.length > 0){
-                        return specifyUserIds.includes(item.id);
-                    }
-                });
-                setUserList(list);
-                // 默认选中当前用户
-                form.setFieldValue("users", props.currentUserIds);
-            }
-        })
-    }, []);
-
-    return (
-        <ModalForm
-            form={form}
-            open={props.visible}
-            title={"用户选择（模拟测试）"}
-            modalProps={{
-                onCancel: () => {
-                    props.setVisible(false);
-                },
-                onClose: () => {
-                    props.setVisible(false);
-                }
-            }}
-            onFinish={async (values) => {
-                const users = values.users;
-                const selectedUsers = userList.filter((item: any) => {
-                    return users.includes(item.id);
-                });
-                props.onFinish(selectedUsers);
-                props.setVisible(false);
-            }}
-        >
-            <ProFormSelect
-                mode={"tags"}
-                name={"users"}
-                label={"用户"}
-                options={userList.map((item: any) => {
-                    return {
-                        label: item.name,
-                        value: item.id
-                    }
-                })}
-            />
-        </ModalForm>
-    )
-}
-
-export default UserSelectView;
diff --git a/admin-ui/src/components/Flow/flow/FlowButtons.tsx b/admin-ui/src/components/Flow/flow/FlowButtons.tsx
deleted file mode 100644
index 0aedc38e..00000000
--- a/admin-ui/src/components/Flow/flow/FlowButtons.tsx
+++ /dev/null
@@ -1,56 +0,0 @@
-import React from "react";
-import {FlowData} from "@/components/Flow/flow/data";
-import {Button, Space} from "antd";
-
-
-interface FlowButtonsProps {
-    flowData: FlowData;
-    requestLoading: boolean;
-    setRequestLoading: (loading: boolean) => void;
-    handlerClick: (item: any) => void;
-}
-
-const FlowButtons: React.FC<FlowButtonsProps> = (props) => {
-    const flowData = props.flowData;
-
-    if (!flowData ) {
-        return null;
-    }
-
-    if(flowData.hasData() && flowData.isDone()){
-        return null;
-    }
-
-    if(flowData.hasData() && !flowData.canHandle()){
-        return null;
-    }
-
-    const buttons = flowData.getNodeButtons();
-
-    return (
-        <Space>
-            {buttons && buttons.map((item: any) => {
-                const style = item.style && {
-                    ...JSON.parse(item.style),
-                    color: "white",
-                } || {};
-                return (
-                    <Button
-                        key={item.id}
-                        onClick={() => {
-                            props.handlerClick(item);
-                        }}
-                        loading={props.requestLoading}
-                        style={{
-                            ...style
-                        }}
-                    >
-                        {item.name}
-                    </Button>
-                )
-            })}
-        </Space>
-    )
-}
-
-export default FlowButtons;
diff --git a/admin-ui/src/components/Flow/flow/FlowChart.scss b/admin-ui/src/components/Flow/flow/FlowChart.scss
deleted file mode 100644
index f67c51f8..00000000
--- a/admin-ui/src/components/Flow/flow/FlowChart.scss
+++ /dev/null
@@ -1,19 +0,0 @@
-.flow-chart-content {
-  border: 1px solid #ebeef5;
-  transition: 0.3s;
-  padding: 15px 16px;
-  border-radius: 12px;
-  position: relative;
-
-  .flow-view {
-    width: 100%;
-    height: 85vh;
-  }
-}
-
-
-
-.lf-mini-map {
-  border: none !important;
-  box-shadow: 3px 0 10px 1px rgb(228, 224, 219);
-}
diff --git a/admin-ui/src/components/Flow/flow/FlowChart.tsx b/admin-ui/src/components/Flow/flow/FlowChart.tsx
deleted file mode 100644
index 336d71b1..00000000
--- a/admin-ui/src/components/Flow/flow/FlowChart.tsx
+++ /dev/null
@@ -1,79 +0,0 @@
-import React, {useEffect, useRef} from "react";
-import {FlowData} from "@/components/Flow/flow/data";
-import {LogicFlow} from "@logicflow/core";
-import {DndPanel, Menu, MiniMap, Snapshot} from "@logicflow/extension";
-import Start from "@/components/Flow/nodes/Start";
-import Node from "@/components/Flow/nodes/Node";
-import Over from "@/components/Flow/nodes/Over";
-import Circulate from "@/components/Flow/nodes/Circulate";
-import '@logicflow/core/es/index.css';
-import '@logicflow/extension/lib/style/index.css';
-import "./FlowChart.scss";
-import {EdgeType} from "@/components/Flow/flow/types";
-
-interface FlowChartProps {
-    flowData: FlowData;
-    edgeType?: EdgeType;
-}
-
-const FlowChart: React.FC<FlowChartProps> = (props) => {
-
-    const flowData = props.flowData;
-    const edgeType = props.edgeType || 'polyline';
-    const container = useRef<HTMLDivElement>(null);
-    const lfRef = useRef<LogicFlow>(null);
-
-    useEffect(() => {
-        const SilentConfig = {
-            isSilentMode: true,
-            stopScrollGraph: false,
-            stopMoveGraph: false,
-            stopZoomGraph: false,
-            edgeTextEdit: false,
-        };
-
-        //@ts-ignore
-        lfRef.current = new LogicFlow({
-            //@ts-ignore
-            container: container.current,
-            ...SilentConfig,
-            background: {
-                backgroundColor: '#f3f5f8'
-            },
-            plugins: [Menu, DndPanel, MiniMap, Snapshot],
-            grid: false,
-            edgeType: edgeType,
-        });
-
-        lfRef.current.setTheme({
-            bezier: {
-                stroke: '#8f94e3',
-                strokeWidth: 1,
-            },
-            polyline: {
-                stroke: '#8f94e3',
-                strokeWidth: 1,
-            },
-            line: {
-                stroke: '#8f94e3',
-                strokeWidth: 1,
-            },
-        });
-        lfRef.current.register(Start);
-        lfRef.current.register(Node);
-        lfRef.current.register(Over);
-        lfRef.current.register(Circulate);
-
-        lfRef.current.render(flowData.getFlowSchema());
-    }, []);
-
-    return (
-        <>
-            <div className="flow-chart-content">
-                <div className={"flow-view"} ref={container}/>
-            </div>
-        </>
-    )
-}
-
-export default FlowChart;
diff --git a/admin-ui/src/components/Flow/flow/FlowDetail.tsx b/admin-ui/src/components/Flow/flow/FlowDetail.tsx
deleted file mode 100644
index 04f3be22..00000000
--- a/admin-ui/src/components/Flow/flow/FlowDetail.tsx
+++ /dev/null
@@ -1,122 +0,0 @@
-import React, {useEffect} from "react";
-import {Divider, Result} from "antd";
-import {ProForm, ProFormTextArea} from "@ant-design/pro-components";
-import {CustomButtonType, FlowFormView, FlowFormViewProps} from "@/components/Flow/flow/types";
-import {FlowData} from "@/components/Flow/flow/data";
-import {useDispatch, useSelector} from "react-redux";
-import {FlowReduxState, hideOpinionEditor, showOpinionEditor} from "@/components/Flow/store/FlowSlice";
-import {FormInstance} from "antd/es/form/hooks/useForm";
-
-interface FlowDetailProps {
-    view: React.ComponentType<FlowFormViewProps> | FlowFormView;
-    form: FormInstance<any>;
-    adviceForm: FormInstance<any>;
-    review?: boolean;
-    flowData: FlowData;
-    // 请求数据加载
-    requestLoading: boolean;
-    // 设置请求数据加载状态
-    setRequestLoading: (loading: boolean) => void;
-    // 流程交互操作
-    handlerClick: (data: {
-        type: CustomButtonType;
-        id?: string;
-    }) => void;
-}
-
-const FlowDetail: React.FC<FlowDetailProps> = (props) => {
-    const flowData = props.flowData;
-
-    const FlowFormView = flowData.getFlowFormView(props.view) as React.ComponentType<FlowFormViewProps>;
-
-    // 触发点击事件Key
-    const eventKey = useSelector((state: FlowReduxState) => state.flow.eventKey);
-
-    // 审批意见输入框
-    const opinionEditorVisible = useSelector((state: FlowReduxState) => state.flow.opinionEditorVisible);
-
-    // 流程视图内容
-    const flowViewVisible = useSelector((state: FlowReduxState) => state.flow.flowViewVisible);
-
-    // flow store redux
-    const dispatch = useDispatch();
-
-    useEffect(() => {
-        if (flowViewVisible) {
-            const advice = flowData.getOpinionAdvice();
-            props.adviceForm.setFieldsValue({
-                advice: advice
-            });
-        }
-    }, [flowViewVisible]);
-
-    return (
-        <>
-            <div className="flowApprovalViewBox">
-                {FlowFormView && (
-                    <div className="flowViewDetail"
-                         style={{height: !FlowFormView || flowData.isStartFlow() ? '85vh' : '68vh'}}>
-                        <FlowFormView
-                            handlerClick={props.handlerClick}
-                            data={flowData.getFlowData()}
-                            form={props.form}
-                            flowData={flowData}
-                            visible={flowViewVisible}
-                            opinions={flowData.getOpinions()}
-                            editable={!flowData.isDone() && flowData.getFlowNodeEditable()}
-                            compare={!flowData.isStartFlow()}
-                            eventKey={eventKey}
-                            requestLoading={props.requestLoading}
-                            setRequestLoading={props.setRequestLoading}
-                            opinionEditorVisible={(visible) => {
-                                if (visible) {
-                                    dispatch(showOpinionEditor());
-                                } else {
-                                    dispatch(hideOpinionEditor());
-                                }
-                            }}
-                        />
-                    </div>
-                )}
-
-                {!FlowFormView && (
-                    <Result
-                        status="404"
-                        title="未设置流程视图"
-                        subTitle="抱歉，该流程未设置流程视图，无法正常展示"
-                    />
-                )}
-
-                {/*仅当非发起流程时再展示审批意见框*/}
-                {FlowFormView && opinionEditorVisible && (
-                    <div className="opinionForm">
-                        <div>
-                            <Divider>
-                                审批意见
-                            </Divider>
-                            <ProForm
-                                form={props.adviceForm}
-                                submitter={false}
-                                autoFocusFirstInput={false}
-                            >
-                                <ProFormTextArea
-                                    disabled={props.review}
-                                    placeholder={'请输入审批意见'}
-                                    rules={[
-                                        {
-                                            required: true,
-                                            message: '请输入审批意见'
-                                        }
-                                    ]}
-                                    name={"advice"}
-                                />
-                            </ProForm>
-                        </div>
-                    </div>
-                )}
-            </div>
-        </>
-    )
-}
-
-export default FlowDetail;
diff --git a/admin-ui/src/components/Flow/flow/FlowHistory.tsx b/admin-ui/src/components/Flow/flow/FlowHistory.tsx
deleted file mode 100644
index b52e5cff..00000000
--- a/admin-ui/src/components/Flow/flow/FlowHistory.tsx
+++ /dev/null
@@ -1,115 +0,0 @@
-import React from "react";
-import {FlowData} from "@/components/Flow/flow/data";
-import {Divider} from "antd";
-import {ProDescriptions} from "@ant-design/pro-components";
-import moment from "moment";
-import FlowHistoryLine from "@/components/Flow/flow/FlowHistoryLine";
-import "./FlowHistoryLine.scss";
-
-interface FlowHistoryProps {
-    flowData:FlowData
-}
-
-const FlowHistory:React.FC<FlowHistoryProps> = (props)=>{
-
-    const flowData = props.flowData;
-
-    const flowRecord = flowData.getCurrentFlowRecord();
-
-    return (
-        <>
-            <Divider>
-                <span className="Divider-title">基本信息</span>
-            </Divider>
-            <div className="flowApprovalHistory">
-                <ProDescriptions
-                    className="proDescriptions"
-                    column={2}
-                    bordered
-                    labelStyle={{
-                        textAlign: "center",
-                        width: "180px",
-                    }}
-                    contentStyle={{
-                        width: "300px",
-                    }}
-                >
-                    <ProDescriptions.Item
-                        span={2}
-                        label={"标题"}
-                    >
-                        <span dangerouslySetInnerHTML={{ __html: flowRecord.title }} ></span>
-                    </ProDescriptions.Item>
-                    <ProDescriptions.Item
-                        span={1}
-                        label={"发起人"}
-                    >
-                        {flowRecord.createOperator.name}
-                    </ProDescriptions.Item>
-                    <ProDescriptions.Item
-                        span={1}
-                        label={"发起时间"}
-                    >
-                        {moment(flowRecord.createTime).format("YYYY-MM-DD HH:mm:ss")}
-                    </ProDescriptions.Item>
-
-                    <ProDescriptions.Item
-                        span={1}
-                        label={"状态"}
-                    >
-                        {flowRecord.flowStatus === 'RUNNING' && '进行中'}
-                        {flowRecord.flowStatus === 'FINISH' && '已结束'}
-                    </ProDescriptions.Item>
-                    <ProDescriptions.Item
-                        span={1}
-                        label={"流程状态"}
-                    >
-                        {flowRecord.recodeType === 'TODO' && '待办'}
-                        {flowRecord.recodeType === 'DONE' && '已办'}
-                        {flowRecord.recodeType === 'TRANSFER' && '已转办'}
-                    </ProDescriptions.Item>
-                    <ProDescriptions.Item
-                        span={1}
-                        label={"是否延期"}
-                    >
-                        {flowRecord.postponedCount > 0 ? '延期' : '未延期'}
-                    </ProDescriptions.Item>
-                    <ProDescriptions.Item
-                        span={1}
-                        label={"是否干预"}
-                    >
-                        {flowRecord.interfere ? '干预' : '未干预'}
-                    </ProDescriptions.Item>
-                    <ProDescriptions.Item
-                        span={1}
-                        label={"是否已读"}
-                    >
-                        {flowRecord.read ? '已读' : '未读'}
-                    </ProDescriptions.Item>
-                    <ProDescriptions.Item
-                        span={1}
-                        label={"超时时间"}
-                    >
-                        {flowRecord.timeoutTime == 0 ? '未设置' : moment(flowRecord.timeoutTime).format("YYYY-MM-DD HH:mm:ss")}
-                    </ProDescriptions.Item>
-                    <ProDescriptions.Item
-                        span={1}
-                        label={"节点名称"}
-                    >
-                        {flowData.getNode(flowRecord.nodeCode)?.name}
-                    </ProDescriptions.Item>
-                </ProDescriptions>
-                <div className="flowApprovalHistory-RecordLine">
-                    <Divider>
-                        <span className="Divider-title">流程历史</span>
-                    </Divider>
-                    <div className="record-line">
-                        <FlowHistoryLine flowData={flowData}/>
-                    </div>
-                </div>
-            </div>
-        </>
-    )
-}
-
-export default FlowHistory;
diff --git a/admin-ui/src/components/Flow/flow/FlowHistoryLine.scss b/admin-ui/src/components/Flow/flow/FlowHistoryLine.scss
deleted file mode 100644
index bd687de2..00000000
--- a/admin-ui/src/components/Flow/flow/FlowHistoryLine.scss
+++ /dev/null
@@ -1,32 +0,0 @@
-.UserOutlined {
-  padding: 10px;
-  color: #fff;
-  background: #1890ff;
-  border-radius: 50%;
-  font-size: 20px;
-}
-.ant-timeline .ant-timeline-item-content {
-  margin-inline-start: 33px;
-}
-
-.ant-timeline .ant-timeline-item {
-  padding-bottom: 50px;
-}
-.ant-timeline .ant-timeline-item-tail {
-  border-inline-start: 2px solid #ccc;
-}
-.title{
-font-size: 16px;
-font-weight: bold;
-}
-.opinion{
-    display: flex;
-    align-items: flex-start;
-    font-size: 15px;
-    &>div {
-        &:nth-child(2) {
-            width: 350px;
-        }
-    }
-}
-
diff --git a/admin-ui/src/components/Flow/flow/FlowHistoryLine.tsx b/admin-ui/src/components/Flow/flow/FlowHistoryLine.tsx
deleted file mode 100644
index bb9b5239..00000000
--- a/admin-ui/src/components/Flow/flow/FlowHistoryLine.tsx
+++ /dev/null
@@ -1,68 +0,0 @@
-import React from "react";
-import {UserOutlined} from "@ant-design/icons";
-import {Tag, Timeline} from "antd";
-import moment from "moment";
-import {FlowData} from "@/components/Flow/flow/data";
-
-interface FlowHistoryLineProps {
-    flowData: FlowData
-}
-
-const FlowHistoryLine: React.FC<FlowHistoryLineProps> = (props) => {
-    const flowData = props.flowData;
-    const timelineData = flowData.getHistoryRecords();
-    const items = timelineData.map((item: any, index: any) => {
-
-        const flowType = item.flowType;
-
-        const flowTypeLabel = ()=>{
-            if(flowType === "DONE"){
-                return (
-                    <Tag color="success">已审批</Tag>
-                );
-            }else if(flowType === "TODO"){
-                return (
-                    <Tag color="processing">待审批</Tag>
-                );
-            }else if(flowType === "CIRCULATE"){
-                return (
-                    <Tag color="cyan">已抄送</Tag>
-                )
-            }else if(flowType === "TRANSFER"){
-                return (
-                    <Tag color="blue">已转办</Tag>
-                )
-            }
-        }
-
-        return {
-            dot: <UserOutlined className="UserOutlined" />,
-            children: (
-                <div>
-                    <div className="title">{flowData.getNode(item.nodeCode).name} </div>
-                    <div><span>状态：</span> <span>{flowTypeLabel()}</span></div>
-                    <div>
-                        <span>创建人：</span> <span>{item.currentOperator.name}</span>
-                        {item.opinion && (
-                            <span style={{ marginLeft: '10px' }}>
-                                ({item.opinion.result == 1 ? '转办' : item.opinion.result == 2 ? '通过' : item.opinion.result == 3 ? '驳回' : '暂存'})
-                            </span>
-                        )}
-                    </div>
-                    <div><span>创建时间：</span> <span>{moment(item.createTime).format("YYYY-MM-DD HH:mm:ss")}</span>
-                    </div>
-                    <div className="opinion"><div>审批意见：</div> <div>{item.opinion?.advice || '暂无意见'}</div></div>
-                </div>
-            ),
-            key: index,
-        }
-    });
-
-    return (
-        <div>
-            <Timeline items={items} />
-        </div>
-    );
-}
-
-export default FlowHistoryLine
diff --git a/admin-ui/src/components/Flow/flow/FlowTabs.tsx b/admin-ui/src/components/Flow/flow/FlowTabs.tsx
deleted file mode 100644
index 6bcf6e03..00000000
--- a/admin-ui/src/components/Flow/flow/FlowTabs.tsx
+++ /dev/null
@@ -1,109 +0,0 @@
-import React from "react";
-import {FlowData} from "@/components/Flow/flow/data";
-import {Skeleton, Tabs} from "antd";
-import {CustomButtonType, FlowFormView, FlowFormViewProps} from "@/components/Flow/flow/types";
-import {FormInstance} from "antd/es/form/hooks/useForm";
-import FlowHistory from "@/components/Flow/flow/FlowHistory";
-import FlowChart from "@/components/Flow/flow/FlowChart";
-import FlowDetail from "@/components/Flow/flow/FlowDetail";
-import {useSelector} from "react-redux";
-import {FlowReduxState} from "@/components/Flow/store/FlowSlice";
-
-
-interface FlowTabsProps {
-    flowData: FlowData;
-    view: React.ComponentType<FlowFormViewProps> | FlowFormView;
-    form: FormInstance<any>;
-    adviceForm: FormInstance<any>;
-    // 预览模式
-    review?: boolean;
-    // 请求数据加载
-    requestLoading: boolean;
-    // 设置请求数据加载状态
-    setRequestLoading: (loading: boolean) => void;
-
-    // 流程交互操作
-    handlerClick: (data: {
-        type: CustomButtonType;
-        id?: string;
-    }) => void;
-}
-
-const FlowTabs: React.FC<FlowTabsProps> = (props) => {
-
-    const flowData = props.flowData;
-
-    if (!flowData.hasData()) {
-        return (
-            <Tabs
-                className="view-flow-tabs"
-                items={[
-                    {
-                        key: 'flow',
-                        label: '流程详情',
-                        children: (
-                            <Skeleton loading={true}>
-                                <></>
-                            </Skeleton>
-                        ),
-                    },
-                    {
-                        key: 'history',
-                        label: '流程记录',
-                        children: (
-                            <Skeleton loading={true}>
-                                <></>
-                            </Skeleton>
-                        ),
-                    },
-                    {
-                        key: 'chart',
-                        label: '流程图',
-                        children: (
-                            <Skeleton loading={true}>
-                                <></>
-                            </Skeleton>
-                        ),
-                    }
-                ]}
-            />
-        );
-    }
-
-
-    const items = [
-        {
-            key: 'flow',
-            label: '流程详情',
-            children: (
-                <FlowDetail
-                    handlerClick={props.handlerClick}
-                    flowData={flowData}
-                    adviceForm={props.adviceForm}
-                    form={props.form}
-                    requestLoading={props.requestLoading}
-                    setRequestLoading={props.setRequestLoading}
-                    view={props.view}/>
-            ),
-        },
-        flowData.showHistory() && {
-            key: 'history',
-            label: '流程记录',
-            children: <FlowHistory flowData={flowData}/>,
-        },
-        {
-            key: 'chart',
-            label: '流程图',
-            children: <FlowChart flowData={flowData}/>,
-        }
-    ] as any[];
-
-    return (
-        <Tabs
-            className="view-flow-tabs"
-            items={items}
-        />
-    )
-}
-
-export default FlowTabs;
diff --git a/admin-ui/src/components/Flow/flow/FlowTitle.tsx b/admin-ui/src/components/Flow/flow/FlowTitle.tsx
deleted file mode 100644
index cbf69bf1..00000000
--- a/admin-ui/src/components/Flow/flow/FlowTitle.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import React from "react";
-import {Button, Space} from "antd";
-import {FlowData} from "@/components/Flow/flow/data";
-import FlowButtons from "@/components/Flow/flow/FlowButtons";
-import {useDispatch} from "react-redux";
-import {hideFlowView} from "@/components/Flow/store/FlowSlice";
-
-interface FlowTitleProps {
-    flowData: FlowData;
-    requestLoading: boolean;
-    setRequestLoading: (loading: boolean) => void;
-    handlerClick: (item: any) => void;
-}
-
-const FlowTitle: React.FC<FlowTitleProps> = (props) => {
-
-    const flowData = props.flowData;
-
-    const title = flowData.getCurrentNodeTitle();
-
-    // flow store redux
-    const dispatch = useDispatch();
-
-    return (
-        <div style={{display: 'flex', justifyContent: 'space-between', alignItems: 'center'}}>
-            <h3 style={{margin: 0}}>{title}</h3>
-            <Space>
-
-                <FlowButtons
-                    flowData={flowData}
-                    requestLoading={props.requestLoading}
-                    setRequestLoading={props.setRequestLoading}
-                    handlerClick={props.handlerClick}
-                />
-
-                <Button
-                    onClick={() => {
-                        dispatch(hideFlowView());
-                    }}
-                >
-                    关闭
-                </Button>
-
-            </Space>
-        </div>
-    )
-}
-
-export default FlowTitle;
diff --git a/admin-ui/src/components/Flow/flow/data.ts b/admin-ui/src/components/Flow/flow/data.ts
deleted file mode 100644
index 8b2ec7f1..00000000
--- a/admin-ui/src/components/Flow/flow/data.ts
+++ /dev/null
@@ -1,317 +0,0 @@
-import React from "react";
-import {FlowFormParams, FlowFormView, FlowFormViewProps, FlowResultMessage} from "@/components/Flow/flow/types";
-
-
-export class FlowWorkData {
-
-    protected readonly data: any;
-
-    constructor(data: any) {
-        this.data = data;
-    }
-
-    getNode = (code: string) => {
-        if (this.data) {
-            const nodes = this.data.flowWork.nodes;
-            for (const node of nodes) {
-                if (node.code === code) {
-                    return node;
-                }
-            }
-        }
-        return null;
-    }
-
-    getWorkCode() {
-        return this.data.flowWork.code;
-    }
-}
-
-
-export class FlowSubmitResultBuilder extends FlowWorkData {
-
-    constructor(data: any) {
-        super(data);
-    }
-
-    builder() {
-        const records = this.data.records;
-        const resultItems = [];
-        for (const record of records) {
-            const node = this.getNode(record.nodeCode);
-            resultItems.push({
-                label: '下级审批节点',
-                value: node.name
-            });
-
-            resultItems.push({
-                label: '下级审批人',
-                value: record.currentOperator.name
-            });
-        }
-        return {
-            title: '流程审批完成',
-            items: resultItems
-        } as FlowResultMessage;
-    }
-}
-
-
-export class FlowTrySubmitResultBuilder {
-
-    private readonly data: any;
-
-    constructor(data: any) {
-        this.data = data;
-    }
-
-    builder() {
-        const operators = this.data.operators;
-        const usernames = operators.map((item: any) => {
-            return item.name;
-        });
-        const flowResult = {
-            title: '下级节点提示',
-            items: [
-                {
-                    label: '下级审批节点',
-                    value: this.data.flowNode.name
-                },
-                {
-                    label: '下级审批人',
-                    value: usernames.join(',')
-                }
-            ]
-        }
-
-        return flowResult as FlowResultMessage;
-    }
-
-}
-
-export class FlowData extends FlowWorkData {
-    private readonly formParams?: FlowFormParams;
-    private recordId:string;
-
-    constructor(recordId:string,data: any, formParams?: FlowFormParams) {
-        super(data);
-        this.recordId = recordId;
-        this.formParams = formParams;
-    }
-
-    setRecordId = (recordId:string)=>{
-        this.recordId = recordId;
-    }
-
-    getRecordId = ()=>{
-        return this.recordId;
-    }
-
-    // 是否可以审批
-    canHandle = () => {
-        return this.data.canHandle;
-    }
-
-    // 是否是开始节点
-    isStartFlow = () => {
-        if (this.data) {
-            return this.data.flowNode.startNode;
-        }
-        return false;
-    }
-
-    // 获取当前节点的code
-    getNodeCode = () => {
-        if (this.data) {
-            return this.data.flowNode.code;
-        }
-        return null;
-    }
-
-    // 获取当前节点的按钮
-    getNodeButtons = () => {
-        if (this.data) {
-            const buttons = this.data.flowNode.buttons;
-            if(buttons){
-                return buttons.sort((item1:any, item2:any) => {
-                    return item1.order - item2.order;
-                })
-            }
-            return [];
-        }
-        return null;
-    }
-
-    // 获取当前节点的按钮
-    getNodeButton = (buttonId: string) => {
-        if (this.data) {
-            const buttons = this.data.flowNode.buttons;
-            if(buttons){
-                return buttons.find((item:any) => item.id === buttonId);
-            }
-        }
-        return null;
-    }
-
-    // 获取当前节点的标题
-    getCurrentNodeTitle = () => {
-        if (this.data) {
-            const node = this.data.flowNode;
-            if (node) {
-                return node.name;
-            }
-        }
-        return null;
-    }
-
-    // 获取当前节点的视图 （内部使用）
-    getFlowFormView(view: React.ComponentType<FlowFormViewProps> | FlowFormView) {
-        if (typeof view === 'object') {
-            const nodeView = this.data.flowNode.view;
-            return (view as FlowFormView)[nodeView];
-        }
-        return view;
-    }
-
-    // 获取当前节点是否可编辑
-    getFlowNodeEditable = () => {
-        if (this.data) {
-            const node = this.data.flowNode;
-            if (node) {
-                return node.editable;
-            }
-        }
-        return false
-    }
-
-    // 获取当前节点的表单数据
-    getFlowData = () => {
-        return {
-            ...this.data.bindData,
-            ...this.formParams
-        }
-    }
-
-    // 获取当前节点的表单数据 （内部使用）
-    getNodeState = (code: string) => {
-        const historyRecords = this.data.historyRecords || [];
-
-        if (code==='over' && this.isFinished()) {
-            return "done";
-        }
-
-        for (const record of historyRecords) {
-            if (record.nodeCode === code) {
-                if (record.flowType === 'TODO') {
-                    return "current";
-                }
-                return "done";
-            }
-        }
-
-        if(this.isFinished()){
-            return "undone";
-        }
-
-        return "wait";
-    }
-
-    // 获取当前节点的流程图
-    getFlowSchema = () => {
-
-        if (this.data.flowWork.schema) {
-            const schema = JSON.parse(this.data.flowWork.schema);
-
-            for (const node of schema.nodes) {
-                node.properties.settingVisible = false;
-                node.properties.state = this.getNodeState(node.properties.code);
-            }
-            return schema;
-        }
-        return null;
-    }
-
-    // 是否存在数据
-    hasData() {
-        return !!this.data;
-    }
-
-    // 获取当前的详情的记录数据
-    getCurrentFlowRecord = () => {
-        return this.data.flowRecord;
-    }
-
-    // 获取审批意见
-    getOpinionAdvice = () => {
-        if(this.data.flowRecord){
-            if(this.data.flowRecord.opinion){
-                return this.data.flowRecord.opinion.advice;
-            }
-        }
-        return null;
-    }
-
-
-    // 获取历史审批意见
-    getOpinions() {
-        if(this.data.opinions){
-            return this.data.opinions.filter((item:any)=>{
-                if(!item.opinion){
-                    return false;
-                }
-                return item.opinion.result!==0;
-            });
-        }
-        return [];
-    }
-
-    // 获取历史记录
-    getHistoryRecords = () => {
-        return this.data.historyRecords;
-    }
-
-    // 是否是审批完成
-    isDone() {
-        if (this.data.flowRecord) {
-            return this.data.flowRecord.flowStatus === 'FINISH' || this.data.flowRecord.flowType === 'DONE';
-        }
-        return false;
-    }
-
-    // 是否是退回状态
-    isReject(){
-        const historyRecords = this.data.historyRecords || [];
-        const currentRecord = this.data.flowRecord;
-        if(currentRecord && historyRecords.length>0){
-            const preId = currentRecord.preId;
-            const preRecord = historyRecords.find((item:any)=>item.id===preId);
-            if(preRecord){
-                return preRecord.flowSourceDirection === 'REJECT';
-            }
-        }
-        return false;
-    }
-
-    // 是否是结束节点
-    private isFinished() {
-        if (this.data.flowRecord) {
-            return this.data.flowRecord.flowStatus === 'FINISH';
-        }
-        return false;
-    }
-
-    // 是否需要展示流转记录 （内部使用）
-    showHistory() {
-        if (this.isDone()) {
-            return true;
-        }
-        return !this.isStartFlow();
-    }
-
-    // 是否展示审批意见 （内部使用）
-    showOpinion() {
-        return this.canHandle() && !this.isStartFlow();
-    }
-
-}
-
diff --git a/admin-ui/src/components/Flow/flow/events.tsx b/admin-ui/src/components/Flow/flow/events.tsx
deleted file mode 100644
index 5940b4f5..00000000
--- a/admin-ui/src/components/Flow/flow/events.tsx
+++ /dev/null
@@ -1,501 +0,0 @@
-import {useEffect} from "react";
-import {FormInstance} from "antd/es/form/hooks/useForm";
-import {FlowData, FlowSubmitResultBuilder, FlowTrySubmitResultBuilder} from "@/components/Flow/flow/data";
-import {
-    custom,
-    postponed,
-    recall,
-    removeFlow,
-    saveFlow,
-    startFlow,
-    submitFlow,
-    transfer,
-    trySubmitFlow,
-    urge
-} from "@/api/flow";
-import {message} from "antd";
-import {useDispatch, useSelector} from "react-redux";
-import {
-    clearTriggerEventClick,
-    clearUserSelect,
-    closeUserSelect,
-    FlowReduxState,
-    setUserSelectModal,
-    showPostponed,
-    showResult,
-    triggerEventClick
-} from "@/components/Flow/store/FlowSlice";
-import {FlowUser} from "@/components/Flow/flow/types";
-
-
-export const registerEvents = (id: string,
-                               setId: (id: string) => void,
-                               data: FlowData,
-                               form: FormInstance<any>,
-                               adviceForm: FormInstance<any>,
-                               setRequestLoading: (loading: boolean) => void,
-                               reload: () => void,
-                               closeFlow: () => void) => {
-
-    const timeOut = useSelector((state: FlowReduxState) => state.flow.timeOut);
-
-    const selectUsers = useSelector((state: FlowReduxState) => state.flow.currentUsers);
-
-    const selectUserType = useSelector((state: FlowReduxState) => state.flow.userSelectType);
-
-    const dispatch = useDispatch();
-
-    let recordId = id;
-    // 保存流程
-    const handlerSaveFlow = () => {
-        const advice = adviceForm.getFieldValue('advice');
-        const flowData = data.getFlowData();
-        const formData = form.getFieldsValue();
-        const body = {
-            recordId,
-            advice,
-            formData: {
-                ...flowData,
-                ...formData,
-            }
-        }
-        setRequestLoading(true);
-        saveFlow(body).then(res => {
-            if (res.success) {
-                message.success('保存成功').then();
-            }
-        }).finally(() => {
-            setRequestLoading(false)
-        })
-    }
-
-    // 发起流程
-    const handlerStartFlow = (callback: (recordId: string) => void) => {
-        const formData = form.getFieldsValue();
-        const advice = adviceForm.getFieldValue('advice');
-        const flowData = data.getFlowData();
-        const workCode = data.getWorkCode();
-        const body = {
-            workCode,
-            advice: advice,
-            formData: {
-                ...flowData,
-                ...formData,
-            }
-        }
-        setRequestLoading(true)
-        startFlow(body).then(res => {
-            if (res.success) {
-                const newRecordId = res.data.records[0].id;
-                setId(newRecordId);
-                callback(newRecordId);
-            }
-        }).finally(() => {
-            setRequestLoading(false)
-        })
-    }
-
-
-    // 发起并提交流程
-    const handlerStartAndSubmitFlow = (callback: (res: any) => void, operatorIds?: any[]) => {
-        setRequestLoading(true);
-        const advice = adviceForm.getFieldValue('advice');
-        const flowData = data.getFlowData();
-        const workCode = data.getWorkCode();
-        form.validateFields().then((formData) => {
-            const body = {
-                workCode,
-                advice: advice,
-                formData: {
-                    ...flowData,
-                    ...formData,
-                }
-            }
-
-            startFlow(body).then(res => {
-                if (res.success) {
-                    const newRecordId = res.data.records[0].id;
-                    const submitBody = {
-                        recordId: newRecordId,
-                        advice: advice,
-                        operatorIds: operatorIds,
-                        success: true,
-                        formData: {
-                            ...flowData,
-                            ...formData,
-                        }
-                    }
-                    submitFlow(submitBody).then(res => {
-                        if (res.success) {
-                            message.success('流程已提交').then();
-                            callback(res);
-                        }
-                    })
-                }
-            }).finally(() => {
-                setRequestLoading(false)
-            })
-        }).catch(errorInfo => {
-            console.log(errorInfo);
-            setRequestLoading(false);
-        });
-    }
-
-    // 提交流程
-    const handleSubmitFlow = (flowState: boolean, callback: (res: any) => void, operatorIds?: any[]) => {
-        adviceForm.validateFields().then((adviceData)=>{
-            const advice = adviceData.advice;
-            setRequestLoading(true);
-            form.validateFields().then((formData) => {
-                const flowData = data.getFlowData();
-                const body = {
-                    recordId,
-                    advice: advice,
-                    operatorIds: operatorIds,
-                    success: flowState,
-                    formData: {
-                        ...flowData,
-                        ...formData,
-                    }
-                }
-
-                submitFlow(body).then(res => {
-                    if (res.success) {
-                        message.success('流程已提交').then();
-                        callback(res);
-                    }
-                }).finally(() => {
-                    setRequestLoading(false)
-                })
-            }).catch(e => {
-                console.log(e);
-                setRequestLoading(false);
-            })
-        }).catch((e)=>{});
-    }
-
-    // 自定义流程
-    const handleCustomFlow = (buttonId: string) => {
-        adviceForm.validateFields().then((adviceData)=> {
-            const advice = adviceData.advice;
-            const formData = form.getFieldsValue();
-            const flowData = data.getFlowData();
-            const body = {
-                recordId,
-                buttonId,
-                advice: advice,
-                formData: {
-                    ...flowData,
-                    ...formData,
-                }
-            }
-            custom(body).then(res => {
-                if (res.success) {
-                    const flowResult = res.data;
-                    dispatch(showResult({
-                        closeFlow: flowResult.closeable,
-                        result: flowResult
-                    }));
-                }
-            });
-        }).catch((e)=>{});
-    }
-
-    // 预提交
-    const handleTrySubmitFlow = (callback: (res: any) => void) => {
-        setRequestLoading(true);
-        form.validateFields().then((formData) => {
-            const advice = adviceForm.getFieldValue('advice');
-            const flowData = data.getFlowData();
-            const body = {
-                recordId,
-                advice: advice,
-                success: true,
-                formData: {
-                    ...flowData,
-                    ...formData,
-                }
-            }
-            trySubmitFlow(body).then(res => {
-                if (res.success) {
-                    callback && callback(res);
-                }
-            }).finally(() => {
-                setRequestLoading(false);
-            });
-        }).catch(e => {
-            console.log(e);
-            setRequestLoading(false);
-        });
-    }
-
-    // 撤回流程
-    const handleRecallFlow = () => {
-        const body = {
-            recordId,
-        }
-        setRequestLoading(true);
-        recall(body).then(res => {
-            if (res.success) {
-                message.success('流程已撤回').then();
-                closeFlow();
-            }
-        }).finally(() => {
-            setRequestLoading(false)
-        })
-    }
-
-
-    // 删除流程
-    const handleRemoveFlow = () => {
-        const body = {
-            recordId,
-        }
-        setRequestLoading(true);
-        removeFlow(body).then(res => {
-            if (res.success) {
-                message.success('流程已删除').then();
-                closeFlow();
-            }
-        }).finally(() => {
-            setRequestLoading(false)
-        })
-    }
-
-
-    // 延期流程
-    const handlePostponedFlow = () => {
-        const body = {
-            recordId,
-            timeOut: timeOut
-        }
-        setRequestLoading(true);
-        postponed(body).then(res => {
-            if (res.success) {
-                message.success('已经延期').then();
-            }
-        }).finally(() => {
-            setRequestLoading(false);
-        })
-    }
-
-    // 转办流程
-    const handlerTransferFlow = (user: FlowUser) => {
-        const advice = adviceForm.getFieldValue('advice');
-        const userId = user.id;
-        setRequestLoading(true);
-        form.validateFields().then((formData) => {
-            const flowData = data.getFlowData();
-            const body = {
-                recordId,
-                advice,
-                targetUserId: userId,
-                formData: {
-                    ...flowData,
-                    ...formData,
-                }
-            }
-
-            transfer(body).then(res => {
-                if (res.success) {
-                    message.success(`已经转办给${user.name}用户`).then();
-                    dispatch(clearUserSelect());
-                    closeFlow();
-                }
-            }).finally(() => {
-                setRequestLoading(false)
-            })
-        }).catch(e => {
-            setRequestLoading(false);
-            console.log(e);
-        })
-    }
-
-    // 催办流程
-    const handlerUrgeFlow = () => {
-        const body = {
-            recordId,
-        }
-        urge(body).then(res => {
-            if (res.success) {
-                message.success('催办提醒已发送').then();
-            }
-        })
-    }
-
-
-    useEffect(() => {
-        if (timeOut > 0) {
-            handlePostponedFlow();
-        }
-    }, [timeOut]);
-
-    useEffect(() => {
-        if (selectUserType === 'transfer' && selectUsers && selectUsers.length > 0) {
-            const currentUser = selectUsers[0];
-            handlerTransferFlow(currentUser);
-        }
-
-        if (selectUserType === 'nextNodeUser' && selectUsers && selectUsers.length > 0) {
-            handleSubmitFlow(true, (res) => {
-                const flowSubmitResultBuilder = new FlowSubmitResultBuilder(res.data);
-                dispatch(closeUserSelect());
-                dispatch(showResult({
-                    closeFlow: true,
-                    result: flowSubmitResultBuilder.builder()
-                }));
-            }, selectUsers.map((item: FlowUser) => {
-                return item.id;
-            }));
-        }
-    }, [selectUsers]);
-
-
-    return (button: {
-        type: string,
-        id?: string,
-        params?:any
-    }) => {
-        switch (button.type) {
-            case 'RELOAD': {
-                reload();
-                break;
-            }
-
-            case 'SAVE': {
-                // 保存流程，如果没有创建流程先创建，若已经创建则保存
-                if (recordId) {
-                    handlerSaveFlow();
-                } else {
-                    handlerStartFlow(() => {
-                        message.success('流程已保存').then();
-                    });
-                }
-                break;
-            }
-            case 'START': {
-                handlerStartFlow(() => {
-                    message.success('流程已保存至个人待办').then();
-                    closeFlow();
-                });
-                break;
-            }
-            case 'SPECIFY_SUBMIT': {
-                const _trySubmitFlow = () => {
-                    handleTrySubmitFlow((res) => {
-                        const operators = res.data.operators;
-                        const userIds = operators.map((item: any) => {
-                            return item.userId;
-                        });
-                        const approvalType = res.data.flowNode.approvalType;
-                        dispatch(setUserSelectModal({
-                            mode: approvalType === 'SIGN' ? 'single' : 'multiple',
-                            type: 'nextNodeUser',
-                            visible: true,
-                            specifyUserIds: userIds
-                        }));
-                    });
-                }
-                if (recordId) {
-                    _trySubmitFlow();
-                } else {
-                    handlerStartFlow((id) => {
-                        recordId = id;
-                        _trySubmitFlow();
-                    });
-                }
-                break;
-            }
-            case 'SUBMIT': {
-                if (recordId) {
-                    handleSubmitFlow(true, (res) => {
-                        const flowSubmitResultBuilder = new FlowSubmitResultBuilder(res.data);
-                        dispatch(showResult({
-                            closeFlow: true,
-                            result: flowSubmitResultBuilder.builder()
-                        }));
-                    }, button.params);
-                } else {
-                    handlerStartAndSubmitFlow((res) => {
-                        const flowSubmitResultBuilder = new FlowSubmitResultBuilder(res.data);
-                        dispatch(showResult({
-                            closeFlow: true,
-                            result: flowSubmitResultBuilder.builder()
-                        }));
-                    });
-                }
-                break;
-            }
-            case 'REJECT': {
-                handleSubmitFlow(false, (res) => {
-                    const flowSubmitResultBuilder = new FlowSubmitResultBuilder(res.data);
-                    dispatch(showResult({
-                        closeFlow: true,
-                        result: flowSubmitResultBuilder.builder()
-                    }));
-                }, button.params);
-                break;
-            }
-            case 'TRY_SUBMIT': {
-                handleTrySubmitFlow((res) => {
-                    const flowSubmitResultBuilder = new FlowTrySubmitResultBuilder(res.data);
-                    dispatch(showResult({
-                        closeFlow: false,
-                        result: flowSubmitResultBuilder.builder()
-                    }));
-                });
-                break;
-            }
-            case 'RECALL': {
-                handleRecallFlow();
-                break;
-            }
-            case 'REMOVE': {
-                handleRemoveFlow();
-                break;
-            }
-            case 'URGE': {
-                handlerUrgeFlow();
-                break;
-            }
-            case 'POSTPONED': {
-                dispatch(showPostponed());
-                break;
-            }
-            case 'TRANSFER': {
-                dispatch(setUserSelectModal({
-                    mode: 'single',
-                    type: 'transfer',
-                    visible: true,
-                    specifyUserIds: []
-                }));
-                break;
-            }
-            case 'CUSTOM': {
-                if (button.id) {
-                    const buttonId = button.id;
-                    if (recordId) {
-                        handleCustomFlow(buttonId);
-                    } else {
-                        handlerStartFlow((id) => {
-                            recordId = id;
-                            handleCustomFlow(buttonId);
-                        });
-                    }
-                }
-                break;
-            }
-            case 'VIEW': {
-                if (button.id) {
-                    const buttonId = button.id;
-                    const customButton = data.getNodeButton(buttonId);
-                    dispatch(triggerEventClick(customButton.eventKey));
-                    setTimeout(() => {
-                        dispatch(clearTriggerEventClick());
-                    }, 300);
-                }
-                break;
-            }
-        }
-    }
-}
diff --git a/admin-ui/src/components/Flow/flow/index.scss b/admin-ui/src/components/Flow/flow/index.scss
deleted file mode 100644
index 5e39229d..00000000
--- a/admin-ui/src/components/Flow/flow/index.scss
+++ /dev/null
@@ -1,149 +0,0 @@
-.ant-modal-root .ant-modal-wrap {
-  overflow: hidden !important;
-}
-.flow-Modal.ant-modal {
-  width: 100% !important;
-  top: 0 !important;
-  max-width: 100% !important;
-}
-.flow-Modal.ant-modal.ant-modal-content {
-  height: 100vh !important;
-}
-.flow-Modal {
-  top: 0;
-  left: 0;
-  right: 0;
-  bottom: 0;
-  margin: auto;
-  height: 100vh;
-  overflow-y: hidden;
-  .ant-modal-content {
-    padding: 20px 50px;
-  }
-  .ant-modal-body {
-    padding: 0;
-  }
-  .ant-tabs .ant-tabs-content-holder {
-    height: 84vh !important;
-    padding-bottom: 20px !important;
-  }
-
-  .ant-modal .ant-modal-footer {
-    padding: 0 20px;
-    border: none;
-  }
-  .ant-modal .ant-modal-content {
-    height: 100vh;
-  }
-  .ant-modal-footer {
-    border: none !important;
-  }
-}
-
-.ant-descriptions-item-label,
-.ant-descriptions-item-content {
-  padding: 6px 24px !important;
-}
-.record-line {
-  margin: 30px 120px;
-  display: flex;
-  justify-content: flex-start;
-  .ant-timeline .ant-timeline-item {
-    display: flex;
-  }
-}
-.Divider-title {
-  font-size: 16px;
-  font-weight: bold;
-  color: #4a79d8;
-}
-.titleBefore {
-  position: relative;
-  padding-left: 20px;
-  &::before {
-    content: "";
-    position: absolute;
-    width: 4px;
-    height: 25px;
-    background-color: #01775b;
-    left: 6px;
-  }
-}
-
-.view-flow-tabs {
-  .flowApprovalViewBox {
-    position: relative;
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    .flowViewDetail {
-      margin-bottom: 100px;
-      width: 100%;
-      // height: 68vh;
-      overflow-y: auto;
-      position: relative;
-      .hr-form {
-        padding: 0px 150px 0px;
-        .hr-form-header-title:not(.hr-form-header-cont-title) {
-          position: sticky;
-          top: 0px;
-          z-index: 2;
-          background: #fff;
-        }
-        .hr-form-header-info {
-          position: sticky;
-          top: 65px;
-          z-index: 2;
-          background-color: #fff;
-        }
-      }
-    }
-    .opinionForm {
-      position: fixed;
-      bottom: 20px;
-      background: #f2f2f2;
-      width: 95%;
-      .ant-divider-horizontal.ant-divider-with-text {
-        margin: 5px 0;
-      }
-      .ant-form {
-        padding: 0px 141px 0 151px;
-      }
-    }
-  }
-  .flowStartView {
-    position: relative;
-    height: 85vh;
-    overflow-y: auto;
-    .hr-form {
-      padding: 0px 150px 0px;
-      .hr-form-header-title:not(.hr-form-header-cont-title) {
-        position: sticky;
-        top: 0px;
-        z-index: 2;
-        background: #fff;
-      }
-      .hr-form-header-info {
-        position: sticky;
-        top: 65px;
-        z-index: 2;
-        background-color: #fff;
-      }
-    }
-  }
-
-  .flowApprovalHistory {
-    height: 78vh;
-    overflow-y: auto;
-    .flowApprovalHistory-RecordLine {
-      position: relative;
-      .ant-divider {
-        position: sticky;
-        top: -1px;
-        z-index: 2;
-        background: #fff;
-        padding: 20px 0px;
-      }
-    }
-  }
-}
diff --git a/admin-ui/src/components/Flow/flow/index.tsx b/admin-ui/src/components/Flow/flow/index.tsx
deleted file mode 100644
index 21309a46..00000000
--- a/admin-ui/src/components/Flow/flow/index.tsx
+++ /dev/null
@@ -1,295 +0,0 @@
-import React, {useEffect} from "react";
-import {Form, Modal} from "antd";
-import {detail} from "@/api/flow";
-import FlowTitle from "@/components/Flow/flow/FlowTitle";
-import {FlowData} from "@/components/Flow/flow/data";
-import FlowTabs from "@/components/Flow/flow/FlowTabs";
-import {
-    EVENT_CLOSE_RESULT_VIEW, EVENT_RELOAD_DATA,
-    FlowFormParams,
-    FlowFormView,
-    FlowFormViewProps,
-    PostponedFormProps,
-    PostponedFormViewKey,
-    ResultFormProps,
-    ResultFormViewKey,
-    UserSelectProps,
-    UserSelectViewKey
-} from "@/components/Flow/flow/types";
-import {registerEvents} from "@/components/Flow/flow/events";
-import {getComponent} from "@/framework/ComponentBus";
-import {Provider, useDispatch, useSelector} from "react-redux";
-import {
-    clearPostponed,
-    clearResult,
-    clearTriggerEventClick,
-    closeUserSelect,
-    FlowReduxState,
-    flowStore,
-    hideFlowView,
-    setSelectUsers,
-    setTimeOut,
-    showFlowView,
-    triggerEventClick
-} from "@/components/Flow/store/FlowSlice";
-import "./index.scss";
-
-interface FlowViewProps {
-    // 流程编号
-    id?: any;
-    // 流程设计编号
-    workCode?: string;
-    // 是否显示
-    visible: boolean;
-    // 设置显示
-    setVisible: (visible: boolean) => void;
-
-    // 预览模式
-    review?: boolean;
-
-    // 表单视图
-    view: React.ComponentType<FlowFormViewProps> | FlowFormView;
-    // 表单参数，参数仅当在发起节点时才会传递
-    formParams?: FlowFormParams;
-}
-
-
-const $FlowView: React.FC<FlowViewProps> = (props) => {
-
-    // 流程表单
-    const [viewForm] = Form.useForm();
-    // 意见表单
-    const [adviceForm] = Form.useForm();
-    // 请求加载
-    const [requestLoading, setRequestLoading] = React.useState(false);
-    // 节点数据
-    const [data, setData] = React.useState<any>(null);
-    // 流程编号
-    const [recordId, setRecordId] = React.useState<string>(props.id);
-
-    // 延期表单展示框
-    const postponedVisible = useSelector((state: FlowReduxState) => state.flow.postponedVisible);
-
-    // 审批结果展示框
-    const resultVisible = useSelector((state: FlowReduxState) => state.flow.resultVisible);
-    // 审批结果
-    const result = useSelector((state: FlowReduxState) => state.flow.result);
-    // 是否关闭流程窗口
-    const resultCloseFlow = useSelector((state: FlowReduxState) => state.flow.resultCloseFlow);
-
-    // 选人展示框
-    const userSelectVisible = useSelector((state: FlowReduxState) => state.flow.userSelectVisible);
-    // 选人范围
-    const specifyUserIds = useSelector((state: FlowReduxState) => state.flow.specifyUserIds);
-    // 选人模式
-    const userSelectMode = useSelector((state: FlowReduxState) => state.flow.userSelectMode);
-    // 选人类型
-    const userSelectType = useSelector((state: FlowReduxState) => state.flow.userSelectType);
-    // 流程视图内容
-    const flowViewVisible = useSelector((state: FlowReduxState) => state.flow.flowViewVisible);
-
-    // flow store redux
-    const dispatch = useDispatch();
-
-    // 请求流程详情数据
-    const loadFlowDetail = () => {
-        if (props.id) {
-            detail(props.id, null).then(res => {
-                if (res.success) {
-                    adviceForm.resetFields();
-                    setData(res.data);
-                }
-            });
-        }
-        if (props.workCode) {
-            detail(null, props.workCode).then(res => {
-                if (res.success) {
-                    adviceForm.resetFields();
-                    setData(res.data);
-                }
-            });
-        }
-    }
-
-    // 重新加载数据
-    const reload = () => {
-        detail(recordId, null).then(res => {
-            if (res.success) {
-                setData(res.data);
-                setTimeout(() => {
-                    dispatch(triggerEventClick(EVENT_RELOAD_DATA));
-                    setTimeout(() => {
-                        dispatch(clearTriggerEventClick());
-                    }, 300);
-                }, 300);
-            }
-        });
-    }
-
-    // 注册事件
-    useEffect(() => {
-        setData(null);
-        setRecordId(props.id);
-        if (props.visible) {
-            dispatch(showFlowView());
-            loadFlowDetail();
-        } else {
-            dispatch(hideFlowView());
-        }
-    }, [props.visible]);
-
-
-    // 关闭结果视图时的事件回掉
-    useEffect(() => {
-        if (!resultVisible) {
-            dispatch(triggerEventClick(EVENT_CLOSE_RESULT_VIEW));
-            setTimeout(() => {
-                dispatch(clearTriggerEventClick());
-            }, 300);
-        }
-    }, [resultVisible]);
-
-
-    // 关闭视图时回掉父级关闭对象
-    useEffect(() => {
-        if (!flowViewVisible) {
-            props.setVisible(false);
-        }
-    }, [flowViewVisible]);
-
-
-    // 流程数据
-    const flowData = new FlowData(props.id,data, props.formParams);
-
-    // 注册事件
-    const handlerClicks = registerEvents(
-        recordId,
-        setRecordId,
-        flowData,
-        viewForm,
-        adviceForm,
-        setRequestLoading,
-        reload,
-        () => {
-            props.setVisible(false)
-        }
-    );
-
-
-    useEffect(() => {
-        if(recordId){
-            flowData.setRecordId(recordId);
-        }
-    }, [recordId]);
-
-
-    if (!props.visible) {
-        return null;
-    }
-
-
-    // 延期表单视图
-    const PostponedFormView = getComponent(PostponedFormViewKey) as React.ComponentType<PostponedFormProps>;
-
-    // 流程结果视图
-    const ResultFormView = getComponent(ResultFormViewKey) as React.ComponentType<ResultFormProps>;
-
-    // 用户选人视图
-    const UserSelectView = getComponent(UserSelectViewKey) as React.ComponentType<UserSelectProps>;
-
-
-
-    return (
-        <Modal
-            className="flow-Modal"
-            width={"100%"}
-            open={props.visible}
-            onClose={() => {
-                props.setVisible(false);
-            }}
-            onCancel={() => {
-                props.setVisible(false);
-            }}
-            onOk={() => {
-                props.setVisible(false);
-            }}
-            destroyOnClose={true}
-            footer={false}
-            closable={false}
-            title={
-                <FlowTitle
-                    flowData={flowData}
-                    requestLoading={requestLoading}
-                    setRequestLoading={setRequestLoading}
-                    handlerClick={(item: any) => {
-                        handlerClicks(item);
-                    }}
-                />
-            }
-        >
-            <FlowTabs
-                handlerClick={handlerClicks}
-                flowData={flowData}
-                view={props.view}
-                requestLoading={requestLoading}
-                setRequestLoading={setRequestLoading}
-                form={viewForm}
-                adviceForm={adviceForm}
-                review={props.review}
-            />
-
-
-            {PostponedFormView && (
-                <PostponedFormView
-                    visible={postponedVisible}
-                    setVisible={() => {
-                        dispatch(clearPostponed());
-                    }}
-                    onFinish={(values) => {
-                        dispatch(setTimeOut(values.hours));
-                    }}
-                />
-            )}
-
-            {ResultFormView && (
-                <ResultFormView
-                    visible={resultVisible}
-                    result={result}
-                    flowCloseable={resultCloseFlow}
-                    closeFlow={() => {
-                        props.setVisible(false);
-                    }}
-                    setVisible={() => {
-                        dispatch(clearResult());
-                    }}
-                />
-            )}
-
-            {UserSelectView && userSelectType && (
-                <UserSelectView
-                    visible={userSelectVisible}
-                    setVisible={() => {
-                        dispatch(closeUserSelect());
-                    }}
-                    onFinish={(values) => {
-                        dispatch(setSelectUsers(values));
-                    }}
-                    specifyUserIds={specifyUserIds}
-                    mode={userSelectMode}
-                    userSelectType={userSelectType}
-                />
-            )}
-        </Modal>
-    )
-}
-
-
-const FlowView: React.FC<FlowViewProps> = (props) => {
-    return (
-        <Provider store={flowStore}>
-            <$FlowView {...props} />
-        </Provider>
-    );
-};
-
-export default FlowView;
diff --git a/admin-ui/src/components/Flow/flow/types.ts b/admin-ui/src/components/Flow/flow/types.ts
deleted file mode 100644
index 9d68bdd4..00000000
--- a/admin-ui/src/components/Flow/flow/types.ts
+++ /dev/null
@@ -1,146 +0,0 @@
-import React from "react";
-import {FormInstance} from "antd/es/form/hooks/useForm";
-import {FlowData} from "@/components/Flow/flow/data";
-
-// 自定义按钮类型
-export type CustomButtonType =
-    'RELOAD'
-    | 'SAVE'
-    | 'START'
-    | 'SUBMIT'
-    | 'TRY_SUBMIT'
-    | 'SPECIFY_SUBMIT'
-    | 'REJECT'
-    | 'TRANSFER'
-    | 'RECALL'
-    | 'POSTPONED'
-    | 'URGE'
-    | 'CUSTOM'
-    | 'VIEW'
-    | 'REMOVE';
-
-// 流程图中线的类型
-export type EdgeType = 'line' | 'polyline' | 'bezier';
-
-// 表单视图属性
-export interface FlowFormViewProps {
-    // 表单数据
-    data: FlowFormParams;
-    // 表单实例
-    form: FormInstance<any>;
-    // 展示状态
-    visible: boolean;
-    // 是否编辑
-    editable: boolean;
-    // 是否对比
-    compare: boolean;
-    // 审批意见
-    opinions?: any;
-    // 流程详情数据信息
-    flowData?: FlowData;
-    // 流程交互操作
-    handlerClick?: (item: {
-        // 按钮类型
-        type: CustomButtonType;
-        // 按钮的Id
-        id?: string;
-        // 操作参数，对应提交时指定人员数组，例如[1,2,3]
-        params?: any;
-    }) => void;
-
-    // 请求数据加载
-    requestLoading?: boolean;
-    // 设置请求数据加载状态
-    setRequestLoading?: (loading: boolean) => void;
-
-    // 自定义前端点击事件触发事件
-    eventKey?: string;
-
-    // 审批意见输入框
-    opinionEditorVisible?: (visible: boolean) => void;
-}
-
-// 表单视图
-export interface FlowFormView {
-    [key: string]: React.ComponentType<FlowFormViewProps>;
-}
-
-// 表单参数
-export interface FlowFormParams {
-    clazzName: string;
-
-    [key: string]: any;
-}
-
-// 关闭结果视图事件
-export const EVENT_CLOSE_RESULT_VIEW = 'EVENT_CLOSE_RESULT_VIEW';
-// 重新加载数据事件
-export const EVENT_RELOAD_DATA = 'EVENT_RELOAD_DATA';
-
-export const PostponedFormViewKey = 'PostponedFormView';
-
-// 延期表单 【拓展视图】
-export interface PostponedFormProps {
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    onFinish: (values: any) => void;
-}
-
-export const ResultFormViewKey = 'ResultFormView';
-
-
-export interface FlowResultMessage {
-    title: string,
-    resultState: string,
-    items: FlowResultItem[]
-}
-
-export interface FlowResultItem {
-    label: string,
-    value: string
-}
-
-// 结果表单 【拓展视图】
-export interface ResultFormProps {
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    // 是否关闭流程框
-    flowCloseable: boolean;
-    closeFlow: () => void;
-
-    result: FlowResultMessage | null;
-}
-
-export const UserSelectViewKey = 'UserSelectView';
-
-export type UserSelectMode = 'single' | 'multiple';
-
-export type UserSelectType =
-// 选择下级流程节点的人员，约定人员id范围
-    'nextNodeUser'
-    // 选择转办人员，约定本单位下的人员
-    | 'transfer'
-    // 选择所有人员，在流程配置上使用
-    | 'users';
-
-export interface FlowUser {
-    id: string;
-    name: string;
-
-    [key: string]: any;
-}
-
-// 选人表单 【拓展视图】
-
-export interface UserSelectProps {
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    onFinish: (values: FlowUser[]) => void;
-    mode: UserSelectMode;
-    // 指定人员范围
-    specifyUserIds: number[];
-    // 当前选择的人员
-    currentUserIds?: number[];
-    // 选人类型
-    userSelectType: UserSelectType;
-}
diff --git a/admin-ui/src/components/Flow/index.scss b/admin-ui/src/components/Flow/index.scss
deleted file mode 100644
index 67214d97..00000000
--- a/admin-ui/src/components/Flow/index.scss
+++ /dev/null
@@ -1,38 +0,0 @@
-.flow-content {
-  border: 1px solid #ebeef5;
-  transition: 0.3s;
-  padding: 15px 16px;
-  border-radius: 12px;
-  position: relative;
-
-  .flow-view {
-    width: 100%;
-    height: 85vh;
-  }
-
-  .flow-panel {
-    position: absolute;
-    left: 35px;
-    min-width: 180px;
-    margin-top: 10px;
-    background-color: white;
-    box-shadow: 0 0 10px 1px rgb(228, 224, 219);
-    border-radius: 6px;
-    z-index: 101;
-  }
-
-  .flow-control {
-    margin-top: 10px;
-    background-color: white;
-    box-shadow: 0 0 10px 1px rgb(228, 224, 219);
-    position: absolute;
-    right: 70px;
-    z-index: 101;
-  }
-}
-.lf-mini-map {
-  border: none !important;
-  box-shadow: 3px 0 10px 1px rgb(228, 224, 219);
-}
-
-
diff --git a/admin-ui/src/components/Flow/index.tsx b/admin-ui/src/components/Flow/index.tsx
deleted file mode 100644
index cf7336ed..00000000
--- a/admin-ui/src/components/Flow/index.tsx
+++ /dev/null
@@ -1,189 +0,0 @@
-import React, {useEffect, useRef} from "react";
-import '@logicflow/core/es/index.css';
-import '@logicflow/extension/lib/style/index.css';
-import "./index.scss";
-
-import {LogicFlow} from "@logicflow/core";
-import {DndPanel, Menu, MiniMap, Snapshot} from "@logicflow/extension";
-import Start from "@/components/Flow/nodes/Start";
-import Node from "@/components/Flow/nodes/Node";
-import Over from "@/components/Flow/nodes/Over";
-import Circulate from "@/components/Flow/nodes/Circulate";
-import ControlPanel from "@/components/Flow/layout/ControlPanel";
-import NodePanel from "@/components/Flow/layout/NodePanel";
-import {message} from "antd";
-import {copy} from "@/components/Flow/panel/shortcuts";
-import FlowUtils from "@/components/Flow/utils";
-import {EdgeType} from "@/components/Flow/flow/types";
-
-export interface FlowActionType {
-    getData: () => any;
-}
-
-interface FlowProps {
-    data?: LogicFlow.GraphConfigData;
-    actionRef?: React.Ref<any>;
-    edgeType?: EdgeType;
-}
-
-const Flow: React.FC<FlowProps> = (props) => {
-    const container = useRef<HTMLDivElement>(null);
-    const lfRef = useRef<LogicFlow>(null);
-    const edgeType = props.edgeType || 'polyline';
-    const [mapVisible, setMapVisible] = React.useState(false);
-
-    if (props.actionRef) {
-        React.useImperativeHandle(props.actionRef, () => ({
-            getData: () => {
-                return lfRef.current?.getGraphData();
-            }
-        }), [props]);
-    }
-
-    const data = props?.data || {};
-    useEffect(() => {
-        const SilentConfig = {
-            isSilentMode: false,
-            stopScrollGraph: true,
-            stopMoveGraph: true,
-            stopZoomGraph: true,
-            edgeTextEdit: false,
-        };
-
-        //@ts-ignore
-        lfRef.current = new LogicFlow({
-            //@ts-ignore
-            container: container.current,
-            ...SilentConfig,
-            background: {
-                backgroundColor: '#f3f5f8'
-            },
-            plugins: [Menu, DndPanel, MiniMap, Snapshot],
-            grid: false,
-            keyboard: {
-                enabled: true,
-                shortcuts: [
-                    {
-                        keys: ['ctrl + v', 'cmd + v'],
-                        callback: () => {
-                            // @ts-ignore
-                            return copy(lfRef.current);
-                        }
-                    }
-                ]
-            },
-            edgeType: edgeType,
-        });
-
-        lfRef.current.setTheme({
-            bezier: {
-                stroke: '#8f94e3',
-                strokeWidth: 1,
-            },
-            polyline: {
-                stroke: '#8f94e3',
-                strokeWidth: 1,
-            },
-            line: {
-                stroke: '#8f94e3',
-                strokeWidth: 1,
-            },
-        });
-        lfRef.current.register(Start);
-        lfRef.current.register(Node);
-        lfRef.current.register(Over);
-        lfRef.current.register(Circulate);
-
-        lfRef.current.render(data);
-
-        lfRef.current.on('node:add', (data) => {
-            console.log('node:add', data);
-        });
-
-    }, []);
-
-
-    //@ts-ignore
-    window.lfRef = lfRef;
-
-
-    const nodeVerify = async (type: string) => {
-        //@ts-ignore
-        const nodes = lfRef.current?.getGraphData().nodes;
-        if (type === 'start-node') {
-            for (let i = 0; i < nodes.length; i++) {
-                if (nodes[i].type === type) {
-                    message.error('开始节点只能有一个');
-                    return false;
-                }
-            }
-        }
-        if (type === 'over-node') {
-            for (let i = 0; i < nodes.length; i++) {
-                if (nodes[i].type === type) {
-                    message.error('结束节点只能有一个');
-                    return false;
-                }
-            }
-        }
-        return true;
-    }
-
-    return (
-        <div className="flow-content">
-            <NodePanel
-                className={"flow-panel"}
-                onDrag={async (type, properties) => {
-                    if (await nodeVerify(type)) {
-                        const UUID = FlowUtils.generateUUID();
-                        lfRef.current?.dnd.startDrag({
-                            id: UUID,
-                            type: type,
-                            properties: {
-                                ...properties,
-                                id: UUID
-                            }
-                        });
-                    }
-                }}
-            />
-            <ControlPanel
-                className={"flow-control"}
-                onZoomIn={() => {
-                    lfRef.current?.zoom(true);
-                }}
-                onZoomOut={() => {
-                    lfRef.current?.zoom(false);
-                }}
-                onZoomReset={() => {
-                    lfRef.current?.resetZoom();
-                    lfRef.current?.resetTranslate();
-                }}
-                onRedo={() => {
-                    lfRef.current?.redo();
-                }}
-                onUndo={() => {
-                    lfRef.current?.undo();
-                }}
-                onMiniMap={() => {
-                    if (mapVisible) {
-                        //@ts-ignore
-                        lfRef.current?.extension.miniMap.hide();
-                    } else {
-                        const modelWidth = lfRef.current?.graphModel.width;
-                        //@ts-ignore
-                        lfRef.current?.extension.miniMap.show(modelWidth - 300, 200);
-                    }
-                    setMapVisible(!mapVisible);
-                }}
-                onDownload={() => {
-                    lfRef.current?.getSnapshot();
-                }}
-
-            />
-            <div className={"flow-view"} ref={container}/>
-        </div>
-    )
-};
-
-export default Flow;
diff --git a/admin-ui/src/components/Flow/layout/ControlPanel.scss b/admin-ui/src/components/Flow/layout/ControlPanel.scss
deleted file mode 100644
index 8579e683..00000000
--- a/admin-ui/src/components/Flow/layout/ControlPanel.scss
+++ /dev/null
@@ -1,18 +0,0 @@
-
-.control-content{
-  width: 30px;
-  border-radius: 12px;
-  background-color: white;
-  display: flex;
-  flex-direction: column;
-  justify-content: space-around;
-  align-items: center;
-  position: absolute;
-  left: 10px;
-  padding: 4px 0;
-  box-shadow: 3px 0 2px 1px rgb(228, 224, 219);
-  .control-item{
-    margin-top: 10px;
-    margin-bottom: 10px;
-  }
-}
diff --git a/admin-ui/src/components/Flow/layout/ControlPanel.tsx b/admin-ui/src/components/Flow/layout/ControlPanel.tsx
deleted file mode 100644
index e85fa501..00000000
--- a/admin-ui/src/components/Flow/layout/ControlPanel.tsx
+++ /dev/null
@@ -1,94 +0,0 @@
-import React from "react";
-import {
-    ArrowDownOutlined,
-    ArrowLeftOutlined,
-    ArrowRightOutlined,
-    EnvironmentOutlined,
-    MonitorOutlined,
-    ZoomInOutlined,
-    ZoomOutOutlined
-} from "@ant-design/icons";
-import "./ControlPanel.scss";
-import {Tooltip} from "antd";
-
-
-interface ControlProps {
-    className: string,
-    iconSize?: number,
-    onZoomIn?: () => void,
-    onZoomOut?: () => void,
-    onZoomReset?: () => void,
-    onUndo?: () => void,
-    onRedo?: () => void,
-    onMiniMap?: () => void,
-    onDownload?: () => void,
-}
-
-const ControlPanel: React.FC<ControlProps> = (props) => {
-    const iconSize = props.iconSize || 16;
-    return (
-        <div className={props.className}>
-            <div className={"control-content"}>
-                <Tooltip className={"control-item"} placement="top" title={"放大"}>
-                    <ZoomInOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            props.onZoomIn?.();
-                        }}
-                    />
-                </Tooltip>
-                <Tooltip className={"control-item"} placement="top" title={"缩小"}>
-                    <ZoomOutOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            props.onZoomOut?.();
-                        }}
-                    />
-                </Tooltip>
-                <Tooltip className={"control-item"} placement="top" title={"自适应"}>
-                    <MonitorOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            props.onZoomReset?.();
-                        }}
-                    />
-                </Tooltip>
-                <Tooltip className={"control-item"} placement="top" title={"上一步"}>
-                    <ArrowLeftOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            props.onUndo?.();
-                        }}
-                    />
-                </Tooltip>
-                <Tooltip className={"control-item"} placement="top" title={"下一步"}>
-                    <ArrowRightOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            props.onRedo?.();
-                        }}
-                    />
-                </Tooltip>
-                <Tooltip className={"control-item"} placement="top" title={"小地图"}>
-                    <EnvironmentOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            props.onMiniMap?.();
-                        }}
-                    />
-                </Tooltip>
-                <Tooltip className={"control-item"} placement="top" title={"下载图片"}>
-                    <ArrowDownOutlined
-                        style={{fontSize: iconSize}}
-                        onClick={() => {
-                            props.onDownload?.();
-                        }}
-                    />
-                </Tooltip>
-
-            </div>
-        </div>
-    )
-}
-
-export default ControlPanel;
diff --git a/admin-ui/src/components/Flow/layout/NodePanel.scss b/admin-ui/src/components/Flow/layout/NodePanel.scss
deleted file mode 100644
index ab660bf7..00000000
--- a/admin-ui/src/components/Flow/layout/NodePanel.scss
+++ /dev/null
@@ -1,13 +0,0 @@
-.panel-title{
-  text-align: center;
-}
-.node-content {
-  margin: 10px;
-
-  .node-item {
-    cursor: pointer;
-    user-select: none;
-    margin-top: 10px;
-    margin-bottom: 10px;
-  }
-}
diff --git a/admin-ui/src/components/Flow/layout/NodePanel.tsx b/admin-ui/src/components/Flow/layout/NodePanel.tsx
deleted file mode 100644
index c88d0b14..00000000
--- a/admin-ui/src/components/Flow/layout/NodePanel.tsx
+++ /dev/null
@@ -1,112 +0,0 @@
-import React from "react";
-import "./NodePanel.scss";
-import {StartView} from "@/components/Flow/nodes/Start";
-import {NodeView} from "@/components/Flow/nodes/Node";
-import {OverView} from "@/components/Flow/nodes/Over";
-import GroovyScript from "@/components/Flow/utils/script";
-import {CirculateView} from "@/components/Flow/nodes/Circulate";
-
-interface NodePanelProps {
-    className: string,
-    onDrag: (type: string, properties: any) => void;
-}
-
-const NodePanel: React.FC<NodePanelProps> = (props) => {
-
-    return (
-        <div className={props.className}>
-            <h3 className={"panel-title"}>流程节点</h3>
-            <div className={"node-content"}>
-                <div
-                    className={"node-item"}
-                    onMouseDown={() => {
-                        props.onDrag('start-node',
-                            {
-                                name: '开始节点',
-                                code: 'start',
-                                type: 'START',
-                                view: 'default',
-                                operatorMatcher: GroovyScript.anyOperatorMatcher,
-                                editable: true,
-                                titleGenerator: GroovyScript.defaultTitleGenerator,
-                                errTrigger: '',
-                                approvalType: 'UN_SIGN',
-                                timeout: 0
-                            }
-                        );
-                    }}
-                >
-                    <StartView name={"开始节点"}/>
-                </div>
-
-                <div
-                    className={"node-item"}
-                    onMouseDown={() => {
-                        props.onDrag('node-node',
-                            {
-                                name: '流程节点',
-                                code: 'flow',
-                                type: 'APPROVAL',
-                                view: 'default',
-                                operatorMatcher: GroovyScript.anyOperatorMatcher,
-                                editable: true,
-                                titleGenerator: GroovyScript.defaultTitleGenerator,
-                                errTrigger: '',
-                                approvalType: 'SIGN',
-                                timeout: 0
-                            }
-                        );
-                    }}
-                >
-                    <NodeView name={"流程节点"}/>
-                </div>
-
-                <div
-                    className={"node-item"}
-                    onMouseDown={() => {
-                        props.onDrag('over-node',
-                            {
-                                name: '结束节点',
-                                code: 'over',
-                                type: 'OVER',
-                                view: 'default',
-                                operatorMatcher: GroovyScript.creatorOperatorMatcher,
-                                editable: true,
-                                titleGenerator: GroovyScript.defaultTitleGenerator,
-                                errTrigger: '',
-                                approvalType: 'UN_SIGN',
-                                timeout: 0
-                            }
-                        );
-                    }}
-                >
-                    <OverView name={"结束节点"}/>
-                </div>
-
-                <div
-                    className={"node-item"}
-                    onMouseDown={() => {
-                        props.onDrag('circulate-node',
-                            {
-                                name: '抄送节点',
-                                code: 'circulate',
-                                type: 'CIRCULATE',
-                                view: 'default',
-                                operatorMatcher: GroovyScript.creatorOperatorMatcher,
-                                editable: true,
-                                titleGenerator: GroovyScript.defaultTitleGenerator,
-                                errTrigger: '',
-                                approvalType: 'CIRCULATE',
-                                timeout: 0
-                            }
-                        );
-                    }}
-                >
-                    <CirculateView name={"抄送节点"}/>
-                </div>
-            </div>
-        </div>
-    )
-}
-
-export default NodePanel;
diff --git a/admin-ui/src/components/Flow/nodes/Circulate/index.scss b/admin-ui/src/components/Flow/nodes/Circulate/index.scss
deleted file mode 100644
index 0e6b78fd..00000000
--- a/admin-ui/src/components/Flow/nodes/Circulate/index.scss
+++ /dev/null
@@ -1,49 +0,0 @@
-
-$color: #61aa1f;
-
-.circulate-node {
-  display: flex;
-  align-items: center;
-  max-height: 40px;
-  border: 1px solid $color;
-  border-radius: 12px;
-  padding: 10px;
-  position: relative;
-
-  .icon {
-    margin-left: 10px;
-    position: absolute;
-    color: $color;
-    font-size: 16px;
-    left: 0;
-  }
-
-  .code {
-    margin-left: 20px;
-    font-size: 14px;
-    color: #4a5e63;
-  }
-
-  .title {
-    margin-left: 5px;
-    font-size: 14px;
-    color: black;
-  }
-
-
-  .setting {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    color: $color;
-    right: 0;
-  }
-
-
-  .state {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    right: 0;
-  }
-}
diff --git a/admin-ui/src/components/Flow/nodes/Circulate/index.tsx b/admin-ui/src/components/Flow/nodes/Circulate/index.tsx
deleted file mode 100644
index 1c037744..00000000
--- a/admin-ui/src/components/Flow/nodes/Circulate/index.tsx
+++ /dev/null
@@ -1,142 +0,0 @@
-import {HtmlNode, HtmlNodeModel} from '@logicflow/core';
-import React from "react";
-import ReactDOM from "react-dom/client";
-import "./index.scss";
-import {InboxOutlined, SettingFilled} from "@ant-design/icons";
-import CirculateSettingPanel from "@/components/Flow/panel/circulate";
-import {NodeState} from "@/components/Flow/nodes/states";
-import {Tag} from "antd";
-import StateLabel from "@/components/Flow/nodes/StateLabel";
-
-type CirculateProperties = {
-    id: string;
-    name: string;
-    code: string;
-    type: string;
-    view: string;
-    operatorMatcher: string;
-    editable: boolean;
-    titleGenerator: string;
-    errTrigger: string;
-    approvalType: string;
-    timeout: number;
-    settingVisible?: boolean;
-    state?: NodeState;
-}
-
-interface CirculateProps {
-    name: string;
-    code?: string;
-    update?: (values: any) => void;
-    settingVisible?: boolean;
-    properties?: CirculateProperties;
-}
-
-export const CirculateView: React.FC<CirculateProps> = (props) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const state = props.properties?.state;
-
-    return (
-        <div className="circulate-node">
-            <InboxOutlined
-                className={"icon"}
-            />
-            <div>
-                <span className={"code"}>
-                    {props.code && (
-                        <>({props.code})</>
-                    )}
-                </span>
-                <span className={"title"}>{props.name}</span>
-            </div>
-
-            {props.settingVisible && (
-                <SettingFilled
-                    className={"setting"}
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-
-            {state && (
-                <div className={"state"}>
-                    <StateLabel
-                        state={state}/>
-                </div>
-            )}
-
-            <CirculateSettingPanel
-                visible={visible}
-                setVisible={setVisible}
-                properties={props.properties}
-                onSettingChange={(values) => {
-                    props.update && props.update(values);
-                }}
-            />
-        </div>
-    );
-}
-
-class CirculateModel extends HtmlNodeModel {
-    setAttributes() {
-        const name = this.properties.name as string;
-        this.width = 200 + name.length * 10;
-        this.height = 45;
-        this.text.editable = false;
-        this.menu = [];
-
-        this.sourceRules = [
-            {
-                message: `不允许输出`,
-                validate: (sourceNode: any, targetNode: any, sourceAnchor, targetAnchor) => {
-                    const edges = this.graphModel.getNodeOutgoingEdge(sourceNode.id);
-                    if (edges.length >= 1) {
-                        return false;
-                    } else {
-                        return true;
-                    }
-                },
-            },
-        ];
-
-        this.anchorsOffset = [
-            [this.width / 2, 0],
-            [0, this.height / 2],
-            [-this.width / 2, 0],
-            [0, -this.height / 2],
-        ];
-    }
-
-
-}
-
-class CirculateNode extends HtmlNode {
-    setHtml(rootEl: SVGForeignObjectElement) {
-        const {properties} = this.props.model as HtmlNodeModel<CirculateProperties>;
-        const div = document.createElement('div');
-        const settingVisible = properties.settingVisible !== false;
-        ReactDOM.createRoot(div).render(
-            <CirculateView
-                name={properties.name}
-                code={properties.code}
-                properties={properties}
-                settingVisible={settingVisible}
-                update={async (values) => {
-                    this.props.model.setProperties(values);
-                }}/>,
-        );
-        //需要清空
-        rootEl.innerHTML = '';
-        rootEl.appendChild(div);
-        super.setHtml(rootEl);
-    }
-}
-
-export default {
-    type: 'circulate-node',
-    view: CirculateNode,
-    model: CirculateModel,
-};
-
diff --git a/admin-ui/src/components/Flow/nodes/Node/index.scss b/admin-ui/src/components/Flow/nodes/Node/index.scss
deleted file mode 100644
index 58b6ecb5..00000000
--- a/admin-ui/src/components/Flow/nodes/Node/index.scss
+++ /dev/null
@@ -1,49 +0,0 @@
-
-$color: #6855ef;
-
-.node-node {
-  display: flex;
-  align-items: center;
-  max-height: 40px;
-  border: 1px solid $color;
-  border-radius: 12px;
-  padding: 10px;
-  position: relative;
-
-  .icon {
-    margin-left: 10px;
-    position: absolute;
-    color: $color;
-    font-size: 16px;
-    left: 0;
-  }
-
-  .code {
-    margin-left: 20px;
-    font-size: 14px;
-    color: #4a5e63;
-  }
-
-  .title {
-    margin-left: 5px;
-    font-size: 14px;
-    color: black;
-  }
-
-
-  .setting {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    color: $color;
-    right: 0;
-  }
-
-  .state {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    right: 0;
-  }
-
-}
diff --git a/admin-ui/src/components/Flow/nodes/Node/index.tsx b/admin-ui/src/components/Flow/nodes/Node/index.tsx
deleted file mode 100644
index 45d09586..00000000
--- a/admin-ui/src/components/Flow/nodes/Node/index.tsx
+++ /dev/null
@@ -1,131 +0,0 @@
-import {HtmlNode, HtmlNodeModel} from '@logicflow/core';
-import React from "react";
-import ReactDOM from "react-dom/client";
-import "./index.scss";
-import {PlusCircleFilled, SettingFilled} from "@ant-design/icons";
-import NodeSettingPanel from "@/components/Flow/panel/node";
-import {NodeState} from "@/components/Flow/nodes/states";
-import {Tag} from "antd";
-import StateLabel from "@/components/Flow/nodes/StateLabel";
-
-type NodeProperties = {
-    id: string;
-    name: string;
-    code: string;
-    type: string;
-    view: string;
-    operatorMatcher: string;
-    editable: boolean;
-    titleGenerator: string;
-    errTrigger: string;
-    approvalType: string;
-    timeout: number;
-    settingVisible?: boolean;
-    state?: NodeState;
-}
-
-interface NodeProps {
-    name: string;
-    code?: string;
-    update?: (values: any) => void;
-    settingVisible?: boolean;
-    properties?: NodeProperties;
-    state?: NodeState;
-}
-
-export const NodeView: React.FC<NodeProps> = (props) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const state = props.properties?.state;
-
-    return (
-        <div className="node-node">
-            <PlusCircleFilled
-                className={"icon"}
-            />
-            <div>
-                <span className={"code"}>
-                    {props.code && (
-                        <>({props.code})</>
-                    )}
-                </span>
-                <span className={"title"}>{props.name}</span>
-            </div>
-
-            {props.settingVisible && (
-                <SettingFilled
-                    className={"setting"}
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-
-            {state && (
-                <div className={"state"}>
-                    <StateLabel
-                        state={state}/>
-                </div>
-            )}
-
-            <NodeSettingPanel
-                visible={visible}
-                setVisible={setVisible}
-                properties={props.properties}
-                onSettingChange={(values) => {
-                    props.update && props.update(values);
-                }}
-            />
-        </div>
-    );
-}
-
-class NodeModel extends HtmlNodeModel {
-    setAttributes() {
-        const name = this.properties.name as string;
-        this.width = 200 + name.length * 10;
-        this.height = 45;
-        this.text.editable = false;
-        this.menu = [];
-
-        this.anchorsOffset = [
-            [this.width / 2, 0],
-            [0, this.height / 2],
-            [-this.width / 2, 0],
-            [0, -this.height / 2],
-        ];
-    }
-
-
-}
-
-class NodeNode extends HtmlNode {
-    setHtml(rootEl: SVGForeignObjectElement) {
-        const {properties} = this.props.model as HtmlNodeModel<NodeProperties>;
-        const div = document.createElement('div');
-
-        const settingVisible = properties.settingVisible !== false;
-
-        ReactDOM.createRoot(div).render(
-            <NodeView
-                name={properties.name}
-                code={properties.code}
-                properties={properties}
-                settingVisible={settingVisible}
-                update={async (values) => {
-                    this.props.model.setProperties(values);
-                }}/>,
-        );
-        //需要清空
-        rootEl.innerHTML = '';
-        rootEl.appendChild(div);
-        super.setHtml(rootEl);
-    }
-}
-
-export default {
-    type: 'node-node',
-    view: NodeNode,
-    model: NodeModel,
-};
-
diff --git a/admin-ui/src/components/Flow/nodes/Over/index.scss b/admin-ui/src/components/Flow/nodes/Over/index.scss
deleted file mode 100644
index 771c830f..00000000
--- a/admin-ui/src/components/Flow/nodes/Over/index.scss
+++ /dev/null
@@ -1,49 +0,0 @@
-
-$color: #ea3f21;
-
-.over-node {
-  display: flex;
-  align-items: center;
-  max-height: 40px;
-  border: 1px solid $color;
-  border-radius: 12px;
-  padding: 10px;
-  position: relative;
-
-  .icon {
-    margin-left: 10px;
-    position: absolute;
-    color: $color;
-    font-size: 16px;
-    left: 0;
-  }
-
-  .code {
-    margin-left: 20px;
-    font-size: 14px;
-    color: #4a5e63;
-  }
-
-  .title {
-    margin-left: 5px;
-    font-size: 14px;
-    color: black;
-  }
-
-
-  .setting {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    color: $color;
-    right: 0;
-  }
-
-  .state {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    right: 0;
-  }
-
-}
diff --git a/admin-ui/src/components/Flow/nodes/Over/index.tsx b/admin-ui/src/components/Flow/nodes/Over/index.tsx
deleted file mode 100644
index 8a4ff435..00000000
--- a/admin-ui/src/components/Flow/nodes/Over/index.tsx
+++ /dev/null
@@ -1,145 +0,0 @@
-import {HtmlNode, HtmlNodeModel} from '@logicflow/core';
-import React from "react";
-import ReactDOM from "react-dom/client";
-import "./index.scss";
-import {CheckCircleFilled, SettingFilled} from "@ant-design/icons";
-import OverSettingPanel from "@/components/Flow/panel/over";
-import FlowUtils from "@/components/Flow/utils";
-import {NodeState} from "@/components/Flow/nodes/states";
-import {Tag} from "antd";
-import StateLabel from "@/components/Flow/nodes/StateLabel";
-
-type OverProperties = {
-    id:string;
-    name: string;
-    code: string;
-    type:string;
-    view: string;
-    operatorMatcher:string;
-    editable:boolean;
-    titleGenerator:string;
-    errTrigger:string;
-    approvalType:string;
-    timeout:number;
-    settingVisible?: boolean;
-    state?: NodeState;
-}
-
-interface OverProps {
-    name: string;
-    code?: string;
-    update?: (values: any) => void;
-    settingVisible?: boolean;
-    properties?: OverProperties;
-}
-
-export const OverView: React.FC<OverProps> = (props) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const state = props.properties?.state;
-
-    return (
-        <div className="over-node">
-            <CheckCircleFilled
-                className={"icon"}
-            />
-            <div>
-                <span className={"code"}>
-                    {props.code && (
-                        <>({props.code})</>
-                    )}
-                </span>
-                <span className={"title"}>{props.name}</span>
-            </div>
-            {props.settingVisible && (
-                <SettingFilled
-                    className={"setting"}
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-
-            {state && (
-                <div className={"state"}>
-                    <StateLabel
-                        state={state}/>
-                </div>
-            )}
-
-            <OverSettingPanel
-                visible={visible}
-                setVisible={setVisible}
-                properties={props.properties}
-                onSettingChange={(values) => {
-                    props.update && props.update(values);
-                }}
-            />
-        </div>
-    );
-}
-
-class OverModel extends HtmlNodeModel {
-
-    setAttributes() {
-        const name = this.properties.name as string;
-        this.width = 200 + name.length * 10;
-        this.height = 45;
-        this.text.editable = false;
-        this.menu = [];
-
-        this.sourceRules = [
-            {
-                message: `不允许输出`,
-                validate: (sourceNode, targetNode: any, sourceAnchor, targetAnchor) => {
-                    const edges = this.graphModel.getNodeIncomingEdge(targetNode.id);
-                    if (edges.length >= 0) {
-                        return false;
-                    } else {
-                        return true;
-                    }
-                },
-            },
-        ];
-
-        this.anchorsOffset = [
-            // [this.width / 2, 0],
-            // [0, this.height / 2],
-            // [-this.width / 2, 0],
-            [0, -this.height / 2],
-        ];
-    }
-
-
-}
-
-class OverNode extends HtmlNode {
-    setHtml(rootEl: SVGForeignObjectElement) {
-        const {properties} = this.props.model as HtmlNodeModel<OverProperties>;
-        const div = document.createElement('div');
-
-        const settingVisible = properties.settingVisible !== false;
-
-        ReactDOM.createRoot(div).render(
-            <OverView
-                name={properties.name}
-                code={properties.code}
-                properties={properties}
-                settingVisible={settingVisible}
-                update={async (values) => {
-                    this.props.model.setProperties(values);
-                }}/>,
-        );
-        //需要清空
-        rootEl.innerHTML = '';
-        rootEl.appendChild(div);
-        super.setHtml(rootEl);
-    }
-}
-
-export default {
-    type: 'over-node',
-    view: OverNode,
-    model: OverModel,
-};
-
diff --git a/admin-ui/src/components/Flow/nodes/Start/index.scss b/admin-ui/src/components/Flow/nodes/Start/index.scss
deleted file mode 100644
index 0b511a9d..00000000
--- a/admin-ui/src/components/Flow/nodes/Start/index.scss
+++ /dev/null
@@ -1,47 +0,0 @@
-$color: #b1ad30;
-
-.start-node {
-  display: flex;
-  align-items: center;
-  max-height: 40px;
-  border: 1px solid $color;
-  border-radius: 12px;
-  padding: 10px;
-  position: relative;
-
-  .icon {
-    margin-left: 10px;
-    position: absolute;
-    color: $color;
-    font-size: 16px;
-    left: 0;
-  }
-
-  .code {
-    margin-left: 20px;
-    font-size: 14px;
-    color: #4a5e63;
-  }
-
-  .title {
-    margin-left: 5px;
-    font-size: 14px;
-    color: black;
-  }
-
-  .setting {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    color: $color;
-    right: 0;
-  }
-
-  .state {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    right: 0;
-  }
-
-}
diff --git a/admin-ui/src/components/Flow/nodes/Start/index.tsx b/admin-ui/src/components/Flow/nodes/Start/index.tsx
deleted file mode 100644
index d399856a..00000000
--- a/admin-ui/src/components/Flow/nodes/Start/index.tsx
+++ /dev/null
@@ -1,128 +0,0 @@
-import {HtmlNode, HtmlNodeModel} from '@logicflow/core';
-import React from "react";
-import ReactDOM from "react-dom/client";
-import "./index.scss";
-import {PlayCircleFilled, SettingFilled} from "@ant-design/icons";
-import StartSettingPanel from "@/components/Flow/panel/start";
-import {NodeState} from "@/components/Flow/nodes/states";
-import {Tag} from "antd";
-import StateLabel from "@/components/Flow/nodes/StateLabel";
-
-type StartProperties ={
-    id:string;
-    name: string;
-    code: string;
-    type:string;
-    view: string;
-    operatorMatcher:string;
-    editable:boolean;
-    titleGenerator:string;
-    errTrigger:string;
-    approvalType:string;
-    timeout:number;
-    settingVisible?: boolean;
-    state?: NodeState;
-}
-
-interface StartProps {
-    name: string;
-    code?: string;
-    settingVisible?: boolean;
-    update?: (values: any) => void;
-    properties?: StartProperties;
-}
-
-export const StartView: React.FC<StartProps> = (props) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const state = props.properties?.state;
-
-    return (
-        <div className="start-node">
-            <PlayCircleFilled
-                className={"icon"}
-            />
-            <div>
-                <span className={"code"}>
-                    {props.code && (
-                        <>({props.code})</>
-                    )}
-                </span>
-                <span className={"title"}>{props.name}</span>
-            </div>
-            {props.settingVisible && (
-                <SettingFilled
-                    className={"setting"}
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-
-            {state && (
-                <div className={"state"}>
-                    <StateLabel
-                        state={state}/>
-                </div>
-            )}
-
-            <StartSettingPanel
-                visible={visible}
-                setVisible={setVisible}
-                properties={props.properties}
-                onSettingChange={(values) => {
-                    props.update && props.update(values);
-                }}
-            />
-        </div>
-    );
-}
-
-class StartModel extends HtmlNodeModel {
-    setAttributes() {
-        const name = this.properties.name as string;
-        this.width = 200 + name.length * 10;
-        this.height = 45;
-        this.text.editable = false;
-        this.menu = [];
-
-        this.anchorsOffset = [
-            // [this.width / 2, 0],
-            [0, this.height / 2],
-            // [-this.width / 2, 0],
-            // [0, -this.height / 2],
-        ];
-    }
-
-}
-
-class StartNode extends HtmlNode {
-    setHtml(rootEl: SVGForeignObjectElement) {
-        const {properties} = this.props.model as HtmlNodeModel<StartProperties>;
-        const div = document.createElement('div');
-
-        const settingVisible = properties.settingVisible !== false;
-
-        ReactDOM.createRoot(div).render(
-            <StartView
-                name={properties.name}
-                code={properties.code}
-                properties={properties}
-                settingVisible={settingVisible}
-                update={async (values) => {
-                    this.props.model.setProperties(values);
-                }}/>,
-        );
-        //需要清空
-        rootEl.innerHTML = '';
-        rootEl.appendChild(div);
-        super.setHtml(rootEl);
-    }
-}
-
-export default {
-    type: 'start-node',
-    view: StartNode,
-    model: StartModel,
-};
-
diff --git a/admin-ui/src/components/Flow/nodes/StateLabel.tsx b/admin-ui/src/components/Flow/nodes/StateLabel.tsx
deleted file mode 100644
index a14afd99..00000000
--- a/admin-ui/src/components/Flow/nodes/StateLabel.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import React from "react";
-import {NodeState} from "@/components/Flow/nodes/states";
-import {Tag} from "antd";
-
-interface StateLabelProps {
-    state:NodeState;
-}
-
-const StateLabel:React.FC<StateLabelProps> = (props)=>{
-
-    const color = (state:NodeState) => {
-        switch (state) {
-            case "done":
-                return "success";
-            case "undone":
-                return "processing";
-            case "current":
-                return "warning";
-            default:
-                return "default";
-        }
-    }
-
-    const label = (state:NodeState) => {
-        switch (state) {
-            case "done":
-                return "已执行";
-            case "undone":
-                return "未执行";
-            case "current":
-                return "当前节点";
-            default:
-                return "待执行";
-        }
-    }
-
-    return (
-        <Tag
-            color={color(props.state)}
-        >
-            {label(props.state)}
-        </Tag>
-    )
-}
-
-export default StateLabel
diff --git a/admin-ui/src/components/Flow/nodes/states.ts b/admin-ui/src/components/Flow/nodes/states.ts
deleted file mode 100644
index b43944d0..00000000
--- a/admin-ui/src/components/Flow/nodes/states.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export type NodeState = "done" | "wait" | "undone" | "current";
-
diff --git a/admin-ui/src/components/Flow/panel/ButtonPanel.tsx b/admin-ui/src/components/Flow/panel/ButtonPanel.tsx
deleted file mode 100644
index 34a1519d..00000000
--- a/admin-ui/src/components/Flow/panel/ButtonPanel.tsx
+++ /dev/null
@@ -1,341 +0,0 @@
-import React from "react";
-import {
-    ActionType,
-    ModalForm,
-    ProColumns,
-    ProForm,
-    ProFormColorPicker,
-    ProFormDigit,
-    ProFormSelect,
-    ProFormText,
-    ProTable
-} from "@ant-design/pro-components";
-import {Button, ColorPicker, Popconfirm, Space} from "antd";
-import FlowUtils from "@/components/Flow/utils";
-import ScriptModal from "@/components/Flow/panel/ScriptModal";
-import {EyeOutlined, ReloadOutlined} from "@ant-design/icons";
-import {CustomButtonType} from "@/components/Flow/flow/types";
-
-interface ButtonPanelProps {
-    id: string;
-}
-
-const buttonEventOptions = [
-    {
-        label: "保存",
-        value: "SAVE"
-    },
-    {
-        label: "发起",
-        value: "START"
-    },
-    {
-        label: "提交",
-        value: "SUBMIT"
-    },
-    {
-        label: "预提交",
-        value: "TRY_SUBMIT"
-    },
-    {
-        label: "指定人员提交",
-        value: "SPECIFY_SUBMIT"
-    },
-    {
-        label: "驳回",
-        value: "REJECT"
-    },
-    {
-        label: "转办",
-        value: "TRANSFER"
-    },
-    {
-        label: "撤销",
-        value: "RECALL"
-    },
-    {
-        label: "延期",
-        value: "POSTPONED"
-    },
-    {
-        label: "催办",
-        value: "URGE"
-    },
-    {
-        label: "自定义接口",
-        value: "CUSTOM"
-    },
-    {
-        label: "自定义事件",
-        value: "VIEW"
-    },
-    {
-        label: "删除",
-        value: "REMOVE"
-    },
-] as {
-    label: string;
-    value: CustomButtonType;
-}[];
-
-
-const ButtonPanel: React.FC<ButtonPanelProps> = (props) => {
-
-    const actionRef = React.useRef<ActionType>();
-
-    const [form] = ProForm.useForm();
-
-    const [groovyForm] = ProForm.useForm();
-
-    const [visible, setVisible] = React.useState(false);
-
-    const [scriptVisible, setScriptVisible] = React.useState(false);
-
-    const [type, setType] = React.useState<string>();
-
-    const columns = [
-        {
-            title: 'id',
-            dataIndex: 'id',
-            key: 'id',
-            hidden: true
-        },
-        {
-            title: '按钮名称',
-            dataIndex: 'name',
-            key: 'name',
-        },
-        {
-            title: '事件类型',
-            dataIndex: 'type',
-            key: 'type',
-            render: (value: string) => {
-                return buttonEventOptions.find((item: any) => item.value == value)?.label;
-            }
-        },
-        {
-            title: '按钮颜色',
-            dataIndex: 'style',
-            key: 'style',
-            render: (_: any, record: any) => {
-                return <ColorPicker value={record.style?.background} disabled={true}/>;
-            }
-        },
-        {
-            title: '排序',
-            dataIndex: 'order',
-            key: 'order',
-        },
-        {
-            title: "操作",
-            valueType: "option",
-            render: (_: any, record: any) => {
-                return [
-                    <a
-                        key={"edit"}
-                        onClick={() => {
-                            form.resetFields();
-                            form.setFieldsValue(record);
-                            setType(record.type);
-                            setVisible(true);
-                        }}
-                    >
-                        修改
-                    </a>,
-                    <Popconfirm
-                        key={"delete"}
-                        title={"确认要删除吗？"}
-                        onConfirm={() => {
-                            FlowUtils.deleteButton(props.id, record.id);
-                            actionRef.current?.reload();
-                        }}>
-                        <a>删除</a>
-                    </Popconfirm>
-                ]
-            }
-        }
-    ] as ProColumns[];
-
-    return (
-        <>
-            <ProTable
-                columns={columns}
-                actionRef={actionRef}
-                key={"id"}
-                search={false}
-                options={false}
-                pagination={false}
-                request={async () => {
-                    const buttons = FlowUtils.getButtons(props.id);
-                    return {
-                        data: buttons,
-                        total: buttons.length,
-                    }
-                }}
-                toolBarRender={() => {
-                    return [
-                        <Button
-                            type={"primary"}
-                            onClick={() => {
-                                form.resetFields();
-                                setVisible(true);
-                            }}
-                        >添加按钮</Button>
-                    ]
-                }}
-            />
-
-            <ModalForm
-                title={"添加节点按钮"}
-                open={visible}
-                form={form}
-                modalProps={{
-                    onCancel: () => {
-                        setVisible(false);
-                    },
-                    onOk: () => {
-                        setVisible(false);
-                    },
-                    destroyOnClose: true
-                }}
-                onFinish={async (values) => {
-                    FlowUtils.updateButton(props.id, values);
-                    setVisible(false);
-                    actionRef.current?.reload();
-                }}
-            >
-                <ProFormText
-                    name={"id"}
-                    hidden={true}
-                />
-
-
-                <ProFormText
-                    name={"name"}
-                    label={"按钮名称"}
-                    placeholder={"请输入按钮名称"}
-                    rules={[
-                        {
-                            required: true,
-                            message: '请输入按钮名称'
-                        }
-                    ]}
-                />
-
-                <ProFormColorPicker
-                    name={"style"}
-                    label={(
-                        <Space>
-                            按钮颜色
-                            <ReloadOutlined
-                                alt={"重置"}
-                                onClick={() => {
-                                    form.setFieldsValue({'style': null});
-                                }}
-                            />
-                        </Space>
-                    )}
-                    normalize={(value:any) => {
-                        if (value) {
-                            return {
-                                background: value.toHexString()
-                            };
-                        }
-                        return value;
-                    }}
-                    getValueProps={(value:any) => {
-                        const color = value?.background;
-                        if (color) {
-                            return {
-                                value: color
-                            }
-                        }
-                        return value;
-                    }}
-                    placeholder={"请选择按钮颜色"}
-                />
-
-                <ProFormSelect
-                    name={"type"}
-                    label={(
-                        <Space>
-                            按钮类型
-
-                            {type === 'CUSTOM' && (
-                                <EyeOutlined
-                                    onClick={() => {
-                                        groovyForm.resetFields();
-                                        const script = form.getFieldValue('groovy') || 'def run(content){\n  //你的代码 \n  return content.createMessageResult(\'我是自定义标题\');\n}';
-                                        groovyForm.setFieldsValue({
-                                            'script': script
-                                        });
-                                        setScriptVisible(!scriptVisible);
-                                    }}/>
-                            )}
-
-                        </Space>
-                    )}
-                    placeholder={"请输入按钮类型"}
-                    rules={[
-                        {
-                            required: true,
-                            message: '请输入按钮类型'
-                        }
-                    ]}
-                    options={buttonEventOptions}
-                    onChange={(value: string) => {
-                        setType(value);
-                    }}
-                />
-
-                {type === 'VIEW' && (
-                    <ProFormText
-                        name={"eventKey"}
-                        label={"事件Key"}
-                        tooltip={"事件Key用于流程Form的事件触发"}
-                        rules={[
-                            {
-                                required: true,
-                                message: '请输入事件Key'
-                            }
-                        ]}
-                    />
-                )}
-
-                <ProFormText
-                    name={"groovy"}
-                    hidden={true}
-                />
-
-                <ScriptModal
-                    onFinish={(values) => {
-                        form.setFieldsValue({
-                            'groovy': values.script
-                        });
-                    }}
-                    form={groovyForm}
-                    setVisible={setScriptVisible}
-                    visible={scriptVisible}/>
-
-                <ProFormDigit
-                    name={"order"}
-                    label={"排序"}
-                    min={0}
-                    fieldProps={{
-                        step: 1
-                    }}
-                    placeholder={"请输入排序"}
-                    rules={[
-                        {
-                            required: true,
-                            message: '请输入排序'
-                        }
-                    ]}
-                />
-
-            </ModalForm>
-        </>
-    )
-}
-
-export default ButtonPanel;
diff --git a/admin-ui/src/components/Flow/panel/EdgePanel.tsx b/admin-ui/src/components/Flow/panel/EdgePanel.tsx
deleted file mode 100644
index 7844029e..00000000
--- a/admin-ui/src/components/Flow/panel/EdgePanel.tsx
+++ /dev/null
@@ -1,192 +0,0 @@
-import React from "react";
-import {ActionType, ProForm, ProTable} from "@ant-design/pro-components";
-import {Input, InputNumber, Popconfirm, Space} from "antd";
-import {CheckOutlined, EditOutlined, SettingOutlined} from "@ant-design/icons";
-import FlowUtils from "@/components/Flow/utils";
-import ScriptModal from "@/components/Flow/panel/ScriptModal";
-
-interface EdgePanelProps {
-    id?: string;
-    type: string;
-}
-
-const EdgePanel: React.FC<EdgePanelProps> = (props) => {
-
-    const [visible, setVisible] = React.useState(false);
-
-    const [name, setName] = React.useState("");
-    const [order, setOrder] = React.useState(0);
-
-    const [form] = ProForm.useForm();
-    const actionRef = React.useRef<ActionType>();
-
-    const handlerChangeName = (id: any) => {
-        FlowUtils.changeEdgeName(id, name);
-        actionRef.current?.reload();
-    }
-
-    const handlerChangeOrder = (id: any) => {
-        FlowUtils.changeEdgeOrder(id, order);
-        actionRef.current?.reload();
-    }
-
-    const handlerChangeBack = (id: any, back: boolean) => {
-        FlowUtils.changeEdgeBack(id, back);
-        actionRef.current?.reload();
-    }
-
-    const handlerChangeOutTrigger = (id: any, outTrigger: string) => {
-        FlowUtils.changeEdgeOutTrigger(id, outTrigger);
-        actionRef.current?.reload();
-    }
-
-    const columns = [
-        {
-            title: 'id',
-            dataIndex: 'id',
-            key: 'id',
-            hidden: true
-        },
-        {
-            title: '关系名称',
-            dataIndex: 'name',
-            key: 'name',
-            render: (text: string, record: any) => {
-                return (
-                    <Space>
-                        {record.name ? record.name : "未命名"}
-
-                        <Popconfirm
-                            title={"修改名称"}
-                            description={(
-                                <Input
-                                    defaultValue={record.name}
-                                    onChange={(e) => {
-                                        setName(e.target.value);
-                                    }}/>
-                            )}
-                            onConfirm={() => {
-                                handlerChangeName(record.id);
-                            }}
-                        >
-                            <EditOutlined/>
-                        </Popconfirm>
-                    </Space>
-                )
-            }
-        },
-        {
-            title: '关系类型',
-            dataIndex: 'type',
-            key: 'relation',
-            render: (text: string, record: any) => {
-                return (
-                    <>{record.source.name} {"->"} {record.target.name}</>
-                )
-            }
-        },
-        {
-            title: '出口设置',
-            dataIndex: 'outTrigger',
-            key: 'outTrigger',
-            render: (text: string, record: any) => {
-                return (
-                    <Space>
-                        <SettingOutlined
-                            onClick={() => {
-                                form.setFieldValue("script", record.outTrigger);
-                                form.setFieldValue("type", record.id);
-                                setVisible(true);
-                            }}/>
-                        {record.outTrigger ? (<CheckOutlined/>) : null}
-                    </Space>
-                )
-            }
-        },
-        {
-            title: '是否退回',
-            dataIndex: 'back',
-            hidden: props.type === 'start',
-            key: 'back',
-            render: (text: string, record: any) => {
-                return (
-
-                    <Space>
-                        <Popconfirm
-                            title={`确认修改为${text ? '否' : '是'}吗？`}
-                            onConfirm={() => {
-                                handlerChangeBack(record.id, !text);
-                            }}
-                        >
-                            <SettingOutlined/>
-                        </Popconfirm>
-
-                        {text ? '是' : '否'}
-                    </Space>
-
-
-                )
-            }
-        },
-        {
-            title: '排序',
-            dataIndex: 'order',
-            key: 'order',
-            render: (text: string, record: any) => {
-                return (
-                    <Space>
-                        <Popconfirm
-                            title={"修改排序"}
-                            description={(
-                                <InputNumber
-                                    defaultValue={record.order}
-                                    step={1}
-                                    onChange={(e) => {
-                                        setOrder(e);
-                                    }}/>)}
-                            onConfirm={() => {
-                                handlerChangeOrder(record.id);
-                            }}
-                        >
-                            <SettingOutlined/>
-                        </Popconfirm>
-
-                        {text}
-                    </Space>
-                )
-            }
-        },
-    ] as any[];
-
-
-    return (
-        <>
-            <ProTable
-                columns={columns}
-                actionRef={actionRef}
-                key={"id"}
-                search={false}
-                options={false}
-                pagination={false}
-                request={async () => {
-                    const data = props.id ? FlowUtils.getEdges(props.id) : [];
-                    return {
-                        data: data.sort((a: any, b: any) => {
-                            return a.order - b.order;
-                        }),
-                        success: true
-                    }
-                }}
-            />
-
-            <ScriptModal
-                onFinish={(values) => {
-                    handlerChangeOutTrigger(values.type, values.script);
-                }}
-                form={form}
-                setVisible={setVisible}
-                visible={visible}/>
-        </>
-    )
-}
-export default EdgePanel;
diff --git a/admin-ui/src/components/Flow/panel/NodePanel.tsx b/admin-ui/src/components/Flow/panel/NodePanel.tsx
deleted file mode 100644
index a5e8c9f7..00000000
--- a/admin-ui/src/components/Flow/panel/NodePanel.tsx
+++ /dev/null
@@ -1,300 +0,0 @@
-import React from "react";
-import {Button, Divider, Space} from "antd";
-import {ProForm, ProFormDigit, ProFormSelect, ProFormSwitch, ProFormText} from "@ant-design/pro-components";
-import {EyeOutlined, SettingOutlined} from "@ant-design/icons";
-import GroovyScript from "@/components/Flow/utils/script";
-import ScriptModal from "@/components/Flow/panel/ScriptModal";
-import {getComponent} from "@/framework/ComponentBus";
-import {UserSelectProps, UserSelectViewKey} from "@/components/Flow/flow/types";
-
-interface NodePanelProps {
-    id?: string,
-    data?: any,
-    onFinish: (values: any) => void,
-    form: any,
-    type: string,
-}
-
-const NodePanel: React.FC<NodePanelProps> = (props) => {
-
-    const [form] = ProForm.useForm();
-
-    const [visible, setVisible] = React.useState(false);
-
-    const [userSelectVisible, setUserSelectVisible] = React.useState(false);
-
-    const [operatorMatcherType, setOperatorMatcherType] = React.useState(props.data?.operatorMatcherType);
-
-    // 用户选人视图
-    const UserSelectView = getComponent(UserSelectViewKey) as React.ComponentType<UserSelectProps>;
-
-
-    return (
-        <>
-            <ProForm
-                initialValues={{
-                    ...props.data,
-                    operatorMatcherType: GroovyScript.operatorMatcherType(props.data?.operatorMatcher),
-                    errTriggerType: GroovyScript.errTriggerType(props.data?.errTrigger),
-                    titleGeneratorType: GroovyScript.titleGeneratorType(props.data?.titleGenerator),
-                }}
-                form={props.form}
-                layout={"vertical"}
-                onFinish={props.onFinish}
-                submitter={false}
-            >
-                <Divider>
-                    基本信息
-                </Divider>
-                <ProFormText
-                    name={"name"}
-                    label={"节点名称"}
-                    rules={[
-                        {
-                            required: true,
-                            message: "请输入节点名称"
-                        }
-                    ]}
-                />
-                <ProFormText
-                    name={"code"}
-                    disabled={props.type === 'start' || props.type === 'over'}
-                    label={"节点编码"}
-                    rules={[
-                        {
-                            required: true,
-                            message: "请输入节点编码"
-                        }
-                    ]}
-                />
-                <ProFormText
-                    name={"view"}
-                    label={"视图名称"}
-                    tooltip={"界面渲染视图的名称"}
-                    rules={[
-                        {
-                            required: true,
-                            message: "请输入视图名称"
-                        }
-                    ]}
-                />
-
-                <Divider>
-                    节点配置
-                </Divider>
-
-                <ProFormSelect
-                    name={"approvalType"}
-                    label={"节点类型"}
-                    hidden={props.type !== 'node'}
-                    tooltip={"会签即多人审批以后再处理，非会签则是一个人处理以后即可响应"}
-                    rules={[
-                        {
-                            required: true,
-                            message: "请输入节点类型"
-                        }
-                    ]}
-                    options={[
-                        {
-                            label: "会签",
-                            value: "SIGN"
-                        },
-                        {
-                            label: "非会签",
-                            value: "UN_SIGN"
-                        },
-                    ]}
-                />
-
-                <ProFormText
-                    tooltip={"操作人匹配脚本"}
-                    name={"operatorMatcher"}
-                    label={"操作人"}
-                    hidden={true}
-                />
-
-                <ProFormSelect
-                    tooltip={"操作人匹配脚本"}
-                    name={"operatorMatcherType"}
-                    label={"操作人"}
-                    width={"lg"}
-                    options={[
-                        {
-                            label: "任意人",
-                            value: "any"
-                        },
-                        {
-                            label: "发起人",
-                            value: "creator"
-                        },
-                        {
-                            label: "自定义",
-                            value: "custom"
-                        },
-                    ]}
-                    onChange={(value) => {
-                        setOperatorMatcherType(value as string);
-                        props.form.setFieldsValue({
-                            operatorMatcher: GroovyScript.operatorMatcher(value as string)
-                        })
-                    }}
-                    addonAfter={(
-                        <Space>
-                            {operatorMatcherType==='custom' && (
-                                <Button
-                                    icon={<SettingOutlined/>}
-                                    onClick={() => {
-                                        setUserSelectVisible(true);
-                                    }}
-                                >
-                                    选择人员
-                                </Button>
-                            )}
-
-                            <EyeOutlined
-                                onClick={() => {
-                                    const value = props.form.getFieldValue("operatorMatcher");
-                                    form.setFieldValue("type", "operatorMatcher");
-                                    form.setFieldValue("script", value);
-                                    setVisible(true);
-                                }}/>
-
-                        </Space>
-                    )}
-                />
-
-                <ProFormDigit
-                    tooltip={"超时提醒时间，单位毫米。为0时则为无超时设置"}
-                    fieldProps={{
-                        step: 1
-                    }}
-                    name={"timeout"}
-                    hidden={props.type === 'circulate'}
-                    label={"超时时间"}
-                />
-
-                <ProFormSwitch
-                    tooltip={"关闭编辑以后在当前节点下的流程表单无法修改数据"}
-                    name={"editable"}
-                    label={"是否编辑"}
-                />
-
-                <ProFormText
-                    name={"titleGenerator"}
-                    label={"自定义标题"}
-                    hidden={true}
-                />
-
-                <ProFormSelect
-                    tooltip={"待办记录中的标题生成器脚本"}
-                    name={"titleGeneratorType"}
-                    label={"自定义标题"}
-                    width={"lg"}
-                    options={[
-                        {
-                            label: "默认",
-                            value: "default"
-                        },
-                        {
-                            label: "自定义",
-                            value: "custom"
-                        },
-                    ]}
-                    onChange={(value) => {
-                        if (value === "default") {
-                            props.form.setFieldsValue({
-                                titleGenerator: GroovyScript.defaultTitleGenerator
-                            })
-                        }
-                    }}
-                    addonAfter={(
-                        <EyeOutlined
-                            onClick={() => {
-                                const value = props.form.getFieldValue("titleGenerator");
-                                form.setFieldValue("type", "titleGenerator");
-                                form.setFieldValue("script", value);
-                                setVisible(true);
-                            }}/>
-                    )}
-                />
-
-                <Divider>
-                    异常配置
-                </Divider>
-
-                <ProFormText
-                    name={"errTrigger"}
-                    label={"异常配置"}
-                    hidden={true}
-                />
-
-                <ProFormSelect
-                    tooltip={"当节点无人员匹配时的异常补偿脚本，可以指定人员或节点处理"}
-                    name={"errTriggerType"}
-                    label={"异常配置"}
-                    width={"lg"}
-                    options={[
-                        {
-                            label: "默认",
-                            value: "default"
-                        },
-                        {
-                            label: "自定义",
-                            value: "custom"
-                        },
-                    ]}
-                    onChange={(value) => {
-                        if (value === "default") {
-                            props.form.setFieldsValue({
-                                errTrigger: GroovyScript.defaultOutTrigger
-                            })
-                        }
-                    }}
-                    addonAfter={(
-                        <EyeOutlined
-                            onClick={() => {
-                                const value = props.form.getFieldValue("errTrigger");
-                                form.setFieldValue("type", "errTrigger");
-                                form.setFieldValue("script", value);
-                                setVisible(true);
-                            }}/>
-                    )}
-                />
-
-            </ProForm>
-
-            <ScriptModal
-                onFinish={(values) => {
-                    const type = values.type;
-                    props.form.setFieldsValue({
-                        [type]: values.script
-                    });
-                }}
-                form={form}
-                setVisible={setVisible}
-                visible={visible}/>
-
-            {UserSelectView && (
-                <UserSelectView
-                    visible={userSelectVisible}
-                    setVisible={setUserSelectVisible}
-                    userSelectType={"users"}
-                    specifyUserIds={GroovyScript.getOperatorUsers(props.form.getFieldValue("operatorMatcher"))}
-                    mode={"multiple"}
-                    onFinish={(values) => {
-                        setUserSelectVisible(false);
-                        const script = GroovyScript.specifyOperatorMatcher.replaceAll("%s", values.map((item: any) => item.id).join(","));
-                        props.form.setFieldsValue({
-                            operatorMatcher: script
-                        });
-                    }}
-                />
-            )}
-
-        </>
-    )
-}
-
-export default NodePanel;
-
-
diff --git a/admin-ui/src/components/Flow/panel/ScriptModal.scss b/admin-ui/src/components/Flow/panel/ScriptModal.scss
deleted file mode 100644
index 3e13f0b2..00000000
--- a/admin-ui/src/components/Flow/panel/ScriptModal.scss
+++ /dev/null
@@ -1,30 +0,0 @@
-/* 样式化 pre 代码块 */
-pre {
-  background-color: #f5f5f5;
-  border: 1px solid #ccc;
-  padding: 15px;
-  border-radius: 5px;
-  font-family: Consolas, "Courier New", monospace;
-  white-space: pre-wrap; /* 保留换行和空格 */
-}
-
-/* 样式化 code 标签内的代码 */
-code {
-  background-color: #eef;
-  padding: 2px 5px;
-  border-radius: 3px;
-  color: #d63384;
-}
-
-/* 备注样式 */
-.comment {
-  color: #999;
-  font-style: italic;
-  margin-top: 10px;
-  display: block;
-}
-
-.ScriptModal {
-  height: 69vh;
-  overflow: auto;
-}
diff --git a/admin-ui/src/components/Flow/panel/ScriptModal.tsx b/admin-ui/src/components/Flow/panel/ScriptModal.tsx
deleted file mode 100644
index 894df80c..00000000
--- a/admin-ui/src/components/Flow/panel/ScriptModal.tsx
+++ /dev/null
@@ -1,162 +0,0 @@
-import React from "react";
-import { ModalForm, ProFormText } from "@ant-design/pro-components";
-import ProFormCode from "@/components/Form/ProFormCode";
-import { EyeOutlined } from "@ant-design/icons";
-import "./ScriptModal.scss";
-
-interface ScriptModalProps {
-    form: any;
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    onFinish: (values: any) => void;
-}
-
-const ScriptModal: React.FC<ScriptModalProps> = (props) => {
-
-    const [show, setShow] = React.useState(false);
-
-    return (
-        <ModalForm
-            className={"ScriptModal"}
-            form={props.form}
-            title={"脚本预览"}
-            width={"80%"}
-            open={props.visible}
-            modalProps={{
-                onCancel: () => {
-                    props.setVisible(false);
-                },
-                onClose: () => {
-                    props.setVisible(false);
-                },
-                destroyOnClose: true
-            }}
-            onFinish={async (values) => {
-                props.onFinish(values);
-                props.setVisible(false);
-            }}
-        >
-            <ProFormText
-                name={"type"}
-                hidden={true}
-            />
-
-            <a onClick={() => {
-                setShow(!show);
-            }}><EyeOutlined /> 查看帮助</a>
-
-            {show && (
-                <div>
-                    <pre>
-                        脚本说明：
-                        函数的定义必须为
-                        <code>
-                            {
-                                `
-def run(content){
-    // 你的代码
-    return true;
-}
-`
-                            }
-                        </code>
-                        在设置操作人是函数返回的人员的id数组：
-                        <code>
-                            {
-                                `
-def run(content){
-    // 你的代码
-    return [1,2,3];
-}
-`
-                            }
-                        </code>
-                        在设置异常配置是函数返回的是人员或节点：
-                        <code>
-                            {
-                                `
-def run(content){
-    // 你的代码
-    // return content.createNodeErrTrigger("code");
-    // return content.createOperatorErrTrigger(1,2,3);
-}
-`
-                            }
-                        </code>
-                        在自定义标题时，返回的字符串：
-                        <code>
-                            {
-                                `
-def run(content){
-    // 你的代码
-    return content.getCreateOperator().getName() + '-' + content.getFlowWork().getTitle() + '-' + content.getFlowNode().getName();
-}
-`
-                            }
-                        </code>
-                        在自定义按钮事件时，返回createMessageResult函数：
-                        <code>
-                            {
-                                `
-def run(content){
-    // 你的代码
-    // 自定义返回标题
-    // return content.createMessageResult('我是自定义标题');
-    // 自定义返回标题并且关闭流程
-    // return content.createMessageResult('我是自定义标题', true);
-    // 自定义返回标题并添加现实内容
-    return content.createMessageResult('我是自定义标题', true).addItem('我是标题1','我是内容2').addItem('我是标题2','我是内容2');
-}
-`
-                            }
-                        </code>
-                        在自定义按钮事件时，操作流程：
-                        <code>
-                            {
-                                `
-def run(content){
-    // 你的代码
-    // 自定义返回标题
-    // return content.createMessageResult('我是自定义标题');
-    // 自定义返回标题，并且设置返回状态 SUCCESS、INFO、WARNING 三种状态
-    // return content.createMessageResult('我是自定义标题').resultState('SUCCESS');
-    // 自定义返回标题并且关闭流程
-    // return content.createMessageResult('我是自定义标题', true);
-    // 提交流程
-    // content.submitFlow();
-    // 驳回流程
-    // content.rejectFlow();
-    // 催办流程
-    // content.urgeFlow();
-    // 保存流程
-    // content.saveFlow();
-    // 撤回流程
-    // content.recallFlow();
-    // 预提交流程
-    // content.trySubmitFlow();
-    // 自定义返回标题并添加现实内容
-    return content.createMessageResult('我是自定义标题', true).addMessage('我是标题1','我是内容2').addMessage('我是标题2','我是内容2').closeable(false);
-}
-`
-                            }
-                        </code>
-                        content对象能力，content对象下存在了flowWork 流程设计对象访问方式为content.getFlowWork()，flowNode 流程节点对象访问方式为content.getFlowNode()，createOperator 创建人对象访问方式为content.getCreateOperator()，currentOperator 当前操作人对象访问方式为content.getCurrentOperator()
-                        获取当前表单数据对象 content.getBindData()，获取当前审批意见对象 content.getOpinion()，获取当前节点的审批历史记录数据 content.getHistoryRecords()，获取spring的bean对象 content.getBean("beanName")
-                    </pre>
-                </div>
-            )}
-
-
-            <ProFormCode
-                name={"script"}
-                codeEditorProps={{
-                    style: {
-                        height: 600
-                    }
-                }}
-            />
-        </ModalForm>
-    )
-}
-
-export default ScriptModal;
diff --git a/admin-ui/src/components/Flow/panel/circulate.tsx b/admin-ui/src/components/Flow/panel/circulate.tsx
deleted file mode 100644
index 7623be70..00000000
--- a/admin-ui/src/components/Flow/panel/circulate.tsx
+++ /dev/null
@@ -1,71 +0,0 @@
-import React from "react";
-import {ProForm} from "@ant-design/pro-components";
-import {Button, Drawer, Space, Tabs} from "antd";
-import NodePanel from "@/components/Flow/panel/NodePanel";
-import EdgePanel from "@/components/Flow/panel/EdgePanel";
-import {SettingPanelProps} from "@/components/Flow/panel/panel.types";
-
-const CirculateSettingPanel: React.FC<SettingPanelProps> = (props) => {
-
-    const [form] = ProForm.useForm();
-
-    return (
-        <Drawer
-            title={"节点设置"}
-            width={"40%"}
-            destroyOnClose={true}
-            onClose={() => {
-                props.setVisible(false);
-            }}
-            open={props.visible}
-            extra={(
-                <Space>
-                    <Button
-                        type={"primary"}
-                        onClick={() => {
-                            form.submit();
-                            props.setVisible(false);
-                        }}
-                    >确认</Button>
-
-                    <Button
-                        onClick={() => {
-                            props.setVisible(false);
-                        }}
-                    >关闭</Button>
-                </Space>
-            )}
-        >
-            <Tabs
-                items={[
-                    {
-                        label: "节点设置",
-                        key: "nodes",
-                        children: (
-                            <NodePanel
-                                type={"circulate"}
-                                form={form}
-                                id={props.properties?.id}
-                                data={props.properties}
-                                onFinish={props.onSettingChange}
-                            />
-                        )
-                    },
-                    {
-                        label: "关系设置",
-                        key: "edges",
-                        children: (
-                            <EdgePanel
-                                type={"node"}
-                                id={props.properties?.id}/>
-                        )
-                    }
-                ]}
-            />
-
-        </Drawer>
-    )
-
-}
-
-export default CirculateSettingPanel;
diff --git a/admin-ui/src/components/Flow/panel/node.tsx b/admin-ui/src/components/Flow/panel/node.tsx
deleted file mode 100644
index cf973de2..00000000
--- a/admin-ui/src/components/Flow/panel/node.tsx
+++ /dev/null
@@ -1,86 +0,0 @@
-import React from "react";
-import {ProForm} from "@ant-design/pro-components";
-import {Button, Drawer, Space, Tabs} from "antd";
-import NodePanel from "@/components/Flow/panel/NodePanel";
-import EdgePanel from "@/components/Flow/panel/EdgePanel";
-import ButtonPanel from "@/components/Flow/panel/ButtonPanel";
-
-interface SettingPanelProps {
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    properties: any;
-    onSettingChange: (values: any) => void;
-}
-
-const NodeSettingPanel: React.FC<SettingPanelProps> = (props) => {
-
-    const [form] = ProForm.useForm();
-
-    return (
-        <Drawer
-            title={"节点设置"}
-            width={"40%"}
-            destroyOnClose={true}
-            onClose={() => {
-                props.setVisible(false);
-            }}
-            open={props.visible}
-            extra={(
-                <Space>
-                    <Button
-                        type={"primary"}
-                        onClick={() => {
-                            form.submit();
-                            props.setVisible(false);
-                        }}
-                    >确认</Button>
-
-                    <Button
-                        onClick={() => {
-                            props.setVisible(false);
-                        }}
-                    >关闭</Button>
-                </Space>
-            )}
-        >
-            <Tabs
-                items={[
-                    {
-                        label: "节点设置",
-                        key: "nodes",
-                        children: (
-                            <NodePanel
-                                type={"node"}
-                                form={form}
-                                id={props.properties?.id}
-                                data={props.properties}
-                                onFinish={props.onSettingChange}
-                            />
-                        )
-                    },
-                    {
-                        label: "节点按钮",
-                        key: "buttons",
-                        children: (
-                            <ButtonPanel
-                                id={props.properties?.id}/>
-                        )
-                    },
-                    {
-                        label: "关系设置",
-                        key: "edges",
-                        children: (
-                            <EdgePanel
-                                type={"node"}
-                                id={props.properties?.id}/>
-                        )
-                    },
-                ]}
-            />
-
-        </Drawer>
-    )
-
-}
-
-export default NodeSettingPanel;
diff --git a/admin-ui/src/components/Flow/panel/over.tsx b/admin-ui/src/components/Flow/panel/over.tsx
deleted file mode 100644
index b8715d94..00000000
--- a/admin-ui/src/components/Flow/panel/over.tsx
+++ /dev/null
@@ -1,51 +0,0 @@
-import React from "react";
-import {ProForm} from "@ant-design/pro-components";
-import {Button, Drawer, Space} from "antd";
-import NodePanel from "@/components/Flow/panel/NodePanel";
-import {SettingPanelProps} from "@/components/Flow/panel/panel.types";
-
-const OverSettingPanel: React.FC<SettingPanelProps> = (props) => {
-
-    const [form] = ProForm.useForm();
-
-    return (
-        <Drawer
-            title={"节点设置"}
-            width={"40%"}
-            destroyOnClose={true}
-            onClose={() => {
-                props.setVisible(false);
-            }}
-            open={props.visible}
-            extra={(
-                <Space>
-                    <Button
-                        type={"primary"}
-                        onClick={() => {
-                            form.submit();
-                            props.setVisible(false);
-                        }}
-                    >确认</Button>
-
-                    <Button
-                        onClick={() => {
-                            props.setVisible(false);
-                        }}
-                    >关闭</Button>
-                </Space>
-            )}
-        >
-            <NodePanel
-                form={form}
-                type={"over"}
-                id={props.properties?.id}
-                data={props.properties}
-                onFinish={props.onSettingChange}
-            />
-
-        </Drawer>
-    )
-
-}
-
-export default OverSettingPanel;
diff --git a/admin-ui/src/components/Flow/panel/panel.types.ts b/admin-ui/src/components/Flow/panel/panel.types.ts
deleted file mode 100644
index a4b82e82..00000000
--- a/admin-ui/src/components/Flow/panel/panel.types.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-
-export interface SettingPanelProps {
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    properties: any;
-    onSettingChange: (values: any) => void;
-}
diff --git a/admin-ui/src/components/Flow/panel/shortcuts.ts b/admin-ui/src/components/Flow/panel/shortcuts.ts
deleted file mode 100644
index c527c73c..00000000
--- a/admin-ui/src/components/Flow/panel/shortcuts.ts
+++ /dev/null
@@ -1,55 +0,0 @@
-import {LogicFlow} from "@logicflow/core";
-import {isEmpty} from 'lodash-es'
-import NodeData = LogicFlow.NodeData;
-import {message} from "antd";
-
-function translateNodeData(nodeData: NodeData, distance: number) {
-    nodeData.x += distance
-    nodeData.y += distance
-
-    if (!isEmpty(nodeData.text)) {
-        nodeData.text.x += distance
-        nodeData.text.y += distance
-    }
-
-    return nodeData
-}
-
-const TRANSLATION_DISTANCE = 40
-
-export const copy = (flow: LogicFlow) => {
-    const selected = flow.getSelectElements(true);
-    if (selected && (selected.nodes || selected.edges)) {
-        flow.clearSelectElements();
-
-        if(selected.edges){
-            // not support copy edges
-            return false;
-        }
-
-        if(selected.nodes){
-            const nodes = selected.nodes;
-            for(const node of nodes){
-                if(node.type ==='start-node'){
-                    message.error('开始节点只能有一个').then();
-                    return false;
-                }
-                if(node.type ==='over-node'){
-                    message.error('结束节点只能有一个').then();
-                    return false;
-                }
-            }
-            const addElements = flow.addElements(
-                selected,
-                TRANSLATION_DISTANCE
-            );
-            if (!addElements) return true;
-            addElements.nodes.forEach((node) => flow.selectElementById(node.id, true));
-            addElements.nodes.forEach((node) => {
-                translateNodeData(node, TRANSLATION_DISTANCE);
-            });
-        }
-
-    }
-    return false;
-}
diff --git a/admin-ui/src/components/Flow/panel/start.tsx b/admin-ui/src/components/Flow/panel/start.tsx
deleted file mode 100644
index a3f5439b..00000000
--- a/admin-ui/src/components/Flow/panel/start.tsx
+++ /dev/null
@@ -1,81 +0,0 @@
-import React from "react";
-import {Button, Drawer, Space, Tabs} from "antd";
-import EdgePanel from "@/components/Flow/panel/EdgePanel";
-import NodePanel from "@/components/Flow/panel/NodePanel";
-import {ProForm} from "@ant-design/pro-components";
-import {SettingPanelProps} from "@/components/Flow/panel/panel.types";
-import ButtonPanel from "@/components/Flow/panel/ButtonPanel";
-
-const StartSettingPanel: React.FC<SettingPanelProps> = (props) => {
-
-    const [form] = ProForm.useForm();
-
-    return (
-        <Drawer
-            title={"节点设置"}
-            width={"40%"}
-            onClose={() => {
-                props.setVisible(false);
-            }}
-            open={props.visible}
-            destroyOnClose={true}
-            extra={(
-                <Space>
-                    <Button
-                        type={"primary"}
-                        onClick={() => {
-                            form.submit();
-                            props.setVisible(false);
-                        }}
-                    >确认</Button>
-
-                    <Button
-                        onClick={() => {
-                            props.setVisible(false);
-                        }}
-                    >关闭</Button>
-                </Space>
-            )}
-
-        >
-            <Tabs
-                items={[
-                    {
-                        label: "节点设置",
-                        key: "nodes",
-                        children: (
-                            <NodePanel
-                                type={"start"}
-                                form={form}
-                                id={props.properties?.id}
-                                data={props.properties}
-                                onFinish={props.onSettingChange}
-                            />
-                        )
-                    },
-                    {
-                        label: "节点按钮",
-                        key: "buttons",
-                        children: (
-                            <ButtonPanel
-                                id={props.properties?.id}/>
-                        )
-                    },
-                    {
-                        label: "关系设置",
-                        key: "edges",
-                        children: (
-                            <EdgePanel
-                                type={"start"}
-                                id={props.properties?.id}/>
-                        )
-                    }
-                ]}
-            />
-
-        </Drawer>
-    )
-
-}
-
-export default StartSettingPanel;
diff --git a/admin-ui/src/components/Flow/readme.md b/admin-ui/src/components/Flow/readme.md
deleted file mode 100644
index ca6b33eb..00000000
--- a/admin-ui/src/components/Flow/readme.md
+++ /dev/null
@@ -1 +0,0 @@
-https://github.com/xoobom/logicflow-vue3
diff --git a/admin-ui/src/components/Flow/register/flow.register.tsx b/admin-ui/src/components/Flow/register/flow.register.tsx
deleted file mode 100644
index f95a4960..00000000
--- a/admin-ui/src/components/Flow/register/flow.register.tsx
+++ /dev/null
@@ -1,9 +0,0 @@
-import {registerComponent} from "@/framework/ComponentBus";
-import PostponedFormView from "@/components/Flow/components/PostponedFormView";
-import ResultFormView from "@/components/Flow/components/ResultFormView";
-import {PostponedFormViewKey, ResultFormViewKey, UserSelectViewKey} from "@/components/Flow/flow/types";
-import UserSelectView from "@/components/Flow/components/UserSelectView";
-
-registerComponent(PostponedFormViewKey, PostponedFormView);
-registerComponent(ResultFormViewKey, ResultFormView);
-registerComponent(UserSelectViewKey, UserSelectView);
diff --git a/admin-ui/src/components/Flow/store/FlowSlice.ts b/admin-ui/src/components/Flow/store/FlowSlice.ts
deleted file mode 100644
index f11a938b..00000000
--- a/admin-ui/src/components/Flow/store/FlowSlice.ts
+++ /dev/null
@@ -1,185 +0,0 @@
-import {configureStore, createSlice, PayloadAction} from '@reduxjs/toolkit';
-import {FlowResultMessage, FlowUser, UserSelectMode, UserSelectType} from "@/components/Flow/flow/types";
-
-export interface FlowStore {
-    // 延期时间窗口
-    postponedVisible: boolean;
-    // 延期时间
-    timeOut: number;
-
-    // 流程结果
-    result: FlowResultMessage | null;
-    // 流程结果展示
-    resultVisible: boolean;
-    // 连带关闭流程
-    resultCloseFlow: boolean;
-
-    // 选人类型
-    userSelectType: UserSelectType | null;
-    // 选人窗口
-    userSelectVisible: boolean;
-    // 选人模式
-    userSelectMode: UserSelectMode;
-    // 选人数据
-    currentUsers: FlowUser[];
-    // 指定人员
-    specifyUserIds: number[];
-
-    // 自定义前端点击事件触发EventKey
-    eventKey: string;
-
-    // 设置FlowViewVisible
-    flowViewVisible:boolean;
-
-    // 审批意见输入框
-    opinionEditorVisible: boolean;
-}
-
-export type FlowStoreAction = {
-    showPostponed: (state: FlowStore) => void;
-    setTimeOut: (state: FlowStore, action: PayloadAction<number>) => void;
-    clearPostponed: (state: FlowStore) => void;
-
-    showResult: (state: FlowStore, action: PayloadAction<{
-        closeFlow: boolean,
-        result: FlowResultMessage
-    }>) => void;
-    clearResult: (state: FlowStore) => void;
-
-    setUserSelectModal: (state: FlowStore, action: PayloadAction<{
-        mode: UserSelectMode,
-        visible: boolean,
-        type: UserSelectType,
-        specifyUserIds: number[]
-    }>) => void;
-    setSelectUsers: (state: FlowStore, action: PayloadAction<FlowUser[]>) => void;
-    closeUserSelect: (state: FlowStore) => void;
-    clearUserSelect: (state: FlowStore) => void;
-
-    triggerEventClick: (state: FlowStore, action: PayloadAction<string>) => void;
-    clearTriggerEventClick: (state: FlowStore) => void;
-
-    showOpinionEditor: (state: FlowStore) => void;
-    hideOpinionEditor: (state: FlowStore) => void;
-
-    showFlowView: (state: FlowStore) => void;
-    hideFlowView: (state: FlowStore) => void;
-}
-
-export const flowSlice = createSlice<FlowStore, FlowStoreAction, "flow", {}>({
-    name: 'flow',
-    initialState: {
-        postponedVisible: false,
-        timeOut: 0,
-        result: null,
-        resultVisible: false,
-        userSelectVisible: false,
-        userSelectMode: 'single',
-        userSelectType: null,
-        resultCloseFlow: false,
-        currentUsers: [],
-        specifyUserIds: [],
-        eventKey: '',
-        opinionEditorVisible: true,
-        flowViewVisible:false
-    },
-    reducers: {
-        showPostponed: (state) => {
-            state.postponedVisible = true;
-        },
-        setTimeOut: (state, action) => {
-            state.timeOut = action.payload;
-        },
-        clearPostponed: (state) => {
-            state.postponedVisible = false;
-            state.timeOut = 0;
-        },
-
-        showResult: (state, action) => {
-            state.result = action.payload.result;
-            state.resultCloseFlow = action.payload.closeFlow;
-            state.resultVisible = true;
-        },
-
-        clearResult: (state) => {
-            state.result = null;
-            state.resultVisible = false;
-            state.resultCloseFlow = false;
-        },
-
-        setUserSelectModal: (state, action) => {
-            state.userSelectMode = action.payload.mode;
-            state.userSelectVisible = action.payload.visible;
-            state.userSelectType = action.payload.type;
-            state.specifyUserIds = action.payload.specifyUserIds;
-        },
-
-        setSelectUsers: (state, action) => {
-            state.userSelectVisible = false;
-            state.currentUsers = action.payload;
-        },
-
-        closeUserSelect: (state) => {
-            state.userSelectVisible = false;
-        },
-
-        clearUserSelect: (state) => {
-            state.userSelectVisible = false;
-            state.userSelectMode = 'single';
-            state.currentUsers = [];
-            state.specifyUserIds = [];
-            state.userSelectType = null;
-        },
-
-        triggerEventClick: (state, action) => {
-            state.eventKey = action.payload;
-        },
-
-        clearTriggerEventClick: (state) => {
-            state.eventKey = '';
-        },
-
-        showOpinionEditor: (state) => {
-            state.opinionEditorVisible = true;
-        },
-
-        hideOpinionEditor: (state) => {
-            state.opinionEditorVisible = false;
-        },
-
-        showFlowView:(state) => {
-            state.flowViewVisible = true;
-        },
-
-        hideFlowView:(state) => {
-            state.flowViewVisible = false;
-        },
-    },
-});
-
-
-export const {
-    showPostponed,
-    setTimeOut,
-    clearPostponed,
-    showResult,
-    clearResult,
-    clearUserSelect,
-    setUserSelectModal,
-    closeUserSelect,
-    setSelectUsers,
-    triggerEventClick,
-    clearTriggerEventClick,
-    hideOpinionEditor,
-    showOpinionEditor,
-    showFlowView,
-    hideFlowView
-} = flowSlice.actions;
-export const flowStore = configureStore({
-    reducer: {
-        flow: flowSlice.reducer
-    },
-});
-
-export type FlowReduxState = ReturnType<typeof flowStore.getState>;
-
diff --git a/admin-ui/src/components/Flow/utils/index.ts b/admin-ui/src/components/Flow/utils/index.ts
deleted file mode 100644
index 63321a0a..00000000
--- a/admin-ui/src/components/Flow/utils/index.ts
+++ /dev/null
@@ -1,215 +0,0 @@
-import GroovyScript from "@/components/Flow/utils/script";
-
-const FlowUtils = {
-
-    generateUUID (){
-        return 'xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx'.replace(/[xy]/g, function (c) {
-            const r = (Math.random() * 16) | 0;
-            const v = c === 'x' ? r : (r & 0x3) | 0x8;
-            return v.toString(16);
-        });
-    },
-
-    getNode(nodeId:string){
-        //@ts-ignore
-        const data = window.lfRef?.current.getGraphData();
-        const nodes = data.nodes;
-
-        const getNode = (nodeId: String) => {
-            for (const node of nodes) {
-                if (node.id === nodeId) {
-                    return node;
-                }
-            }
-        }
-        return getNode(nodeId);
-    },
-
-    getButtons(nodeId:string){
-        const node = FlowUtils.getNode(nodeId);
-        const buttons =  node.properties.buttons || [];
-        buttons.sort((a:any,b:any)=>{
-            return a.order - b.order;
-        })
-        return buttons;
-    },
-
-
-    updateButton(nodeId:string,button:any){
-        //@ts-ignore
-        const data = window.lfRef?.current.getGraphData();
-        const nodes = data.nodes;
-        const getNode = (nodeId: String) => {
-            for (const node of nodes) {
-                if (node.id === nodeId) {
-                    return node;
-                }
-            }
-        }
-        const node = getNode(nodeId);
-        const buttons =  node.properties.buttons || [];
-
-        let update = false;
-
-        for(const item of buttons){
-            if(item.id == button.id){
-                item.name = button.name;
-                item.style = button.style;
-                item.type = button.type;
-                item.order = button.order;
-                item.groovy = button.groovy;
-                item.eventKey = button.eventKey;
-
-                update = true;
-            }
-        }
-        if(!update){
-            button.id = FlowUtils.generateUUID();
-            node.properties.buttons = [...buttons,button];
-        }
-        this.render(data);
-    },
-
-
-    deleteButton(nodeId:string,buttonId:string){
-        //@ts-ignore
-        const data = window.lfRef?.current.getGraphData();
-        const nodes = data.nodes;
-        const getNode = (nodeId: String) => {
-            for (const node of nodes) {
-                if (node.id === nodeId) {
-                    return node;
-                }
-            }
-        }
-        const node = getNode(nodeId);
-        const buttons =  node.properties.buttons || [];
-        node.properties.buttons = buttons.filter((item:any)=>item.id !== buttonId);
-        this.render(data);
-    },
-
-    getEdges(nodeId: String) {
-        //@ts-ignore
-        const data = window.lfRef?.current.getGraphData();
-        const list = []
-        const nodes = data.nodes;
-
-        const getNodeProperties = (nodeId: String) => {
-            for (const node of nodes) {
-                if (node.id === nodeId) {
-                    return node.properties;
-                }
-            }
-        }
-
-        let update = false;
-
-        let order = 0;
-        if (data && data.edges) {
-            const edges = data.edges;
-            for (const index in edges) {
-                const edge = edges[index];
-                if (edge.sourceNodeId === nodeId) {
-                    order ++;
-                    if (!edge.properties.outTrigger) {
-                        edge.properties = {
-                            ...edge.properties,
-                            outTrigger: GroovyScript.defaultOutTrigger,
-                            order: order,
-                            back: false
-                        }
-                        update = true;
-                    }
-
-                    list.push({
-                        id: edge.id,
-                        name: edge.properties.name,
-                        source: getNodeProperties(edge.sourceNodeId),
-                        target: getNodeProperties(edge.targetNodeId),
-                        outTrigger: edge.properties.outTrigger,
-                        back: edge.properties.back,
-                        order: edge.properties.order,
-                        edge
-                    });
-                }
-            }
-        }
-
-        if(update){
-            this.render(data);
-        }
-
-        return list;
-    },
-
-
-    changeEdgeName(edgeId:string,name:string){
-        //@ts-ignore
-        const data = window.lfRef?.current.getGraphData();
-        if (data && data.edges) {
-            const edges = data.edges;
-            for (const index in edges) {
-                const edge = edges[index];
-                if (edge.id === edgeId) {
-                    edge.properties.name = name;
-                    this.render(data);
-                }
-            }
-        }
-    },
-
-
-    changeEdgeOrder(edgeId:string,order:number){
-        //@ts-ignore
-        const data = window.lfRef?.current.getGraphData();
-        if (data && data.edges) {
-            const edges = data.edges;
-            for (const index in edges) {
-                const edge = edges[index];
-                if (edge.id === edgeId) {
-                    edge.properties.order = order;
-                    this.render(data);
-                }
-            }
-        }
-    },
-
-    changeEdgeBack(edgeId:string,back:boolean){
-        //@ts-ignore
-        const data = window.lfRef?.current.getGraphData();
-        if (data && data.edges) {
-            const edges = data.edges;
-            for (const index in edges) {
-                const edge = edges[index];
-                if (edge.id === edgeId) {
-                    edge.properties.back = back;
-                    this.render(data);
-                }
-            }
-        }
-    },
-
-
-    changeEdgeOutTrigger(edgeId:string,outTrigger:string){
-        //@ts-ignore
-        const data = window.lfRef?.current.getGraphData();
-        if (data && data.edges) {
-            const edges = data.edges;
-            for (const index in edges) {
-                const edge = edges[index];
-                if (edge.id === edgeId) {
-                    edge.properties.outTrigger = outTrigger;
-                    this.render(data);
-                }
-            }
-        }
-    },
-
-    render(data: any) {
-        //@ts-ignore
-        window.lfRef?.current.render(data);
-    }
-}
-
-
-export default FlowUtils;
diff --git a/admin-ui/src/components/Flow/utils/script.ts b/admin-ui/src/components/Flow/utils/script.ts
deleted file mode 100644
index 81c05479..00000000
--- a/admin-ui/src/components/Flow/utils/script.ts
+++ /dev/null
@@ -1,63 +0,0 @@
-
-
-class GroovyScript {
-
-    public static defaultOutTrigger = "def run(content) {return true;}";
-    public static defaultTitleGenerator = "def run(content){ return content.getCurrentOperator().getName() + '-' + content.getFlowWork().getTitle() + '-' + content.getFlowNode().getName();}";
-
-    public static anyOperatorMatcher="def run(content) {return [content.getCurrentOperator().getUserId()];}";
-    public static creatorOperatorMatcher="def run(content) {return [content.getCreateOperator().getUserId()];}";
-    public static specifyOperatorMatcher="def run(content) {return [%s];}";
-
-
-    static operatorMatcherType(operatorMatcher: string) {
-        if (operatorMatcher === GroovyScript.anyOperatorMatcher) {
-            return "any";
-        } else if (operatorMatcher === GroovyScript.creatorOperatorMatcher) {
-            return "creator";
-        } else {
-            return "custom";
-        }
-    }
-
-
-    static getOperatorUsers(script:string) {
-        if(script) {
-            const match = script.match(/\[([\d,\s]+)\]/);
-            if (match && match[1]) {
-                return match[1]
-                    .split(',')
-                    .map(num => parseInt(num.trim(), 10));
-            }
-        }
-        return [];
-    }
-
-    static errTriggerType(errTrigger: string) {
-        if (errTrigger === GroovyScript.defaultOutTrigger) {
-            return "default";
-        } else {
-            return "custom";
-        }
-    }
-
-    static titleGeneratorType = (titleGenerator: string) => {
-        if (titleGenerator === GroovyScript.defaultTitleGenerator) {
-            return "default";
-        } else {
-            return "custom";
-        }
-    }
-
-    static operatorMatcher(operatorMatcherType: string) {
-        if (operatorMatcherType === "any") {
-            return GroovyScript.anyOperatorMatcher;
-        } else if (operatorMatcherType === "creator") {
-            return GroovyScript.creatorOperatorMatcher;
-        } else {
-            return GroovyScript.specifyOperatorMatcher;
-        }
-    }
-}
-
-export default GroovyScript;
diff --git a/admin-ui/src/components/Form/ProFormCode/index.tsx b/admin-ui/src/components/Form/ProFormCode/index.tsx
deleted file mode 100644
index 5b3d715c..00000000
--- a/admin-ui/src/components/Form/ProFormCode/index.tsx
+++ /dev/null
@@ -1,26 +0,0 @@
-import React from 'react';
-import {ProForm, ProFormItemProps} from "@ant-design/pro-components";
-import CodeEditor, {CodeEditorProps} from "@/components/CodeEditor";
-
-interface ProFormCodeProps extends ProFormItemProps {
-    codeEditorProps?: CodeEditorProps;
-}
-
-const ProFormCode: React.FC<ProFormCodeProps> = (props) => {
-
-    const itemProps = {
-        ...props,
-        codeEditorProps: undefined
-    };
-
-    return (
-        <ProForm.Item
-            {...itemProps}
-        >
-            <CodeEditor {...props.codeEditorProps}/>
-        </ProForm.Item>
-
-    );
-};
-
-export default ProFormCode;
diff --git a/admin-ui/src/components/Form/ProFormIcons/index.tsx b/admin-ui/src/components/Form/ProFormIcons/index.tsx
deleted file mode 100644
index 075365f6..00000000
--- a/admin-ui/src/components/Form/ProFormIcons/index.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import React from 'react'
-import * as icons from '@ant-design/icons'
-import {ProFormSelect, ProFormSelectProps} from '@ant-design/pro-components'
-import Index from "@/components/View/MenuIcon";
-
-export interface ProFormIconsProps extends ProFormSelectProps {
-    placeholder?: string
-}
-
-const ProFormIcons: React.FC<ProFormIconsProps> = (props) => {
-    //@ts-ignore
-    const iconList = Object.keys(icons).filter((item: any) => typeof icons[item] === 'object')
-    const options = iconList.map((item: any) => {
-        return {
-            label: (
-                <>
-                    <Index icon={item} style={{marginLeft: '8px'}}/> {item}
-                </>
-            ),
-            value: item
-        }
-    });
-
-    return (
-        <ProFormSelect
-            {
-                ...props
-            }
-            showSearch
-            allowClear
-            options={options}
-        >
-        </ProFormSelect>
-    )
-}
-
-export default ProFormIcons;
diff --git a/admin-ui/src/components/Form/ProFormUploader/index.tsx b/admin-ui/src/components/Form/ProFormUploader/index.tsx
deleted file mode 100644
index 6709783e..00000000
--- a/admin-ui/src/components/Form/ProFormUploader/index.tsx
+++ /dev/null
@@ -1,21 +0,0 @@
-import React from "react";
-import {RcFile} from "antd/es/upload";
-import {ProFormUploadButton, ProFormUploadButtonProps} from "@ant-design/pro-form";
-import {rcFileToBase64} from "@/utils/base64";
-
-const ProFormUploader: React.FC<ProFormUploadButtonProps> = (props) => {
-    return (
-        <ProFormUploadButton
-            {...props}
-            fieldProps={{
-                customRequest: async ({file, onSuccess}) => {
-                    const base64 = await rcFileToBase64(file as RcFile);
-                    // @ts-ignore
-                    onSuccess(base64);
-                }
-            }}
-        />
-    )
-}
-
-export default ProFormUploader;
diff --git a/admin-ui/src/components/Layout/AvatarHeader/index.tsx b/admin-ui/src/components/Layout/AvatarHeader/index.tsx
deleted file mode 100644
index 3dad5c78..00000000
--- a/admin-ui/src/components/Layout/AvatarHeader/index.tsx
+++ /dev/null
@@ -1,132 +0,0 @@
-import React, {useCallback} from "react";
-import {Avatar, message} from "antd";
-import HeaderDropdown from "@/components/Layout/HeaderDropdown";
-import {LogoutOutlined, SettingOutlined} from "@ant-design/icons";
-import {ModalForm, ProFormText} from "@ant-design/pro-components";
-import {clearUser} from "@/api/account";
-import {useNavigate} from "react-router-dom";
-
-
-interface AvatarHeaderProps {
-    props?: any;
-}
-
-const AvatarHeader: React.FC<AvatarHeaderProps> = (props) => {
-    const [visible, setVisible] = React.useState(false);
-    const navigate = useNavigate();
-
-    const username = localStorage.getItem('username');
-    const avatar = localStorage.getItem('avatar');
-
-    const loginOut = () => {
-        clearUser();
-        navigate('/login', {replace: true});
-    };
-
-    const menuItems = [
-        {
-            key: 'changePwd',
-            icon: <SettingOutlined/>,
-            label: '修改密码',
-        },
-        {
-            key: 'logout',
-            icon: <LogoutOutlined/>,
-            label: '退出登录',
-        },
-    ];
-
-    const onMenuClick = useCallback(
-        (event: any) => {
-            const {key} = event;
-            if (key === 'logout') {
-                loginOut();
-            }
-            if (key === 'changePwd') {
-                setVisible(true);
-            }
-        },
-        [],
-    );
-
-    return (
-        <>
-
-            <HeaderDropdown
-                menu={{
-                    selectedKeys: [],
-                    onClick: onMenuClick,
-                    items: menuItems,
-                }}
-            >
-                <div>
-                    <Avatar src={avatar} style={{
-                        marginRight:10
-                    }}/>
-                    {username}
-                </div>
-            </HeaderDropdown>
-
-            <ModalForm
-                open={visible}
-                title="修改密码"
-                modalProps={{
-                    destroyOnClose: true,
-                    onCancel: () => {
-                        setVisible(false);
-                    }
-                }}
-                onFinish={async (values) => {
-                    const newPwd = values.newPwd;
-                    const newPwd2 = values.newPwd2;
-                    if (newPwd !== newPwd2) {
-                        message.error('两次密码不一致');
-                        return false;
-                    }
-
-
-                    return false;
-                }}
-            >
-                <ProFormText.Password
-                    name="oldPwd"
-                    label="旧密码"
-                    placeholder="请输入旧密码"
-                    rules={[
-                        {
-                            required: true,
-                            message: '请输入旧密码',
-                        },
-                    ]}
-                />
-
-                <ProFormText.Password
-                    name="newPwd"
-                    label="新密码"
-                    placeholder="请输入新密码"
-                    rules={[
-                        {
-                            required: true,
-                            message: '请输入新密码',
-                        },
-                    ]}
-                />
-
-                <ProFormText.Password
-                    name="newPwd2"
-                    label="确认密码"
-                    placeholder="请输入确认密码"
-                    rules={[
-                        {
-                            required: true,
-                            message: '请输入确认密码',
-                        },
-                    ]}
-                />
-            </ModalForm>
-
-        </>
-    )
-}
-
-export default AvatarHeader;
\ No newline at end of file
diff --git a/admin-ui/src/components/Layout/HeaderAction/index.tsx b/admin-ui/src/components/Layout/HeaderAction/index.tsx
deleted file mode 100644
index f04f3cfb..00000000
--- a/admin-ui/src/components/Layout/HeaderAction/index.tsx
+++ /dev/null
@@ -1,6 +0,0 @@
-export const loadHeaderAction = (props: any) => {
-    if (props.isMobile) return [];
-    return [
-    ];
-}
-
diff --git a/admin-ui/src/components/Layout/HeaderDropdown/index.tsx b/admin-ui/src/components/Layout/HeaderDropdown/index.tsx
deleted file mode 100644
index 886da81d..00000000
--- a/admin-ui/src/components/Layout/HeaderDropdown/index.tsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import { Dropdown } from 'antd';
-import type { DropDownProps } from 'antd/es/dropdown';
-import React from 'react';
-
-export type HeaderDropdownProps = {
-  overlayClassName?: string;
-  placement?: 'bottomLeft' | 'bottomRight' | 'topLeft' | 'topCenter' | 'topRight' | 'bottomCenter';
-} & Omit<DropDownProps, 'overlay'>;
-
-const HeaderDropdown: React.FC<HeaderDropdownProps> = ({ overlayClassName: cls, ...restProps }) => {
-
-  return <Dropdown   {...restProps} />;
-};
-
-export default HeaderDropdown;
diff --git a/admin-ui/src/components/Layout/Page/index.tsx b/admin-ui/src/components/Layout/Page/index.tsx
deleted file mode 100644
index 398314cc..00000000
--- a/admin-ui/src/components/Layout/Page/index.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React from "react";
-import RoleKeyProvider from "@/framework/Permission/RoleKeyProvider";
-import {PageContainer} from "@ant-design/pro-components";
-import {PageContainerProps} from "@ant-design/pro-layout/es/components/PageContainer";
-import AccessProvider from "@/framework/Permission/AccessProvider";
-
-
-interface PageProps {
-    children: React.ReactNode;
-    enablePageContainer?: boolean;
-    pageContainerProps?: PageContainerProps;
-}
-
-
-const Page: React.FC<PageProps> = (props) => {
-    return (
-        <RoleKeyProvider>
-            <AccessProvider>
-                {props.enablePageContainer && (
-                    <PageContainer {...props.pageContainerProps}>
-                        {props.children}
-                    </PageContainer>
-                )}
-                {!props.enablePageContainer && (
-                    <>
-                        {props.children}
-                    </>
-                )}
-            </AccessProvider>
-        </RoleKeyProvider>
-    )
-}
-
-export default Page;
\ No newline at end of file
diff --git a/admin-ui/src/components/View/MenuIcon/index.tsx b/admin-ui/src/components/View/MenuIcon/index.tsx
deleted file mode 100644
index a0a5b04c..00000000
--- a/admin-ui/src/components/View/MenuIcon/index.tsx
+++ /dev/null
@@ -1,77 +0,0 @@
-import React from 'react';
-import Icon, * as icons from '@ant-design/icons'
-
-
-interface MenuIconProps {
-    icon: string
-    className?: string;
-    style?: React.CSSProperties;
-    onClick?: () => void;
-}
-
-const MenuIcon: React.FC<MenuIconProps> = (props) => {
-    if (props.icon === '-') {
-        return <></>
-    }
-
-    // @ts-ignore
-    const component = icons[props.icon];
-    if (props.icon) {
-        return (
-            <Icon
-                onClick={props.onClick}
-                className={props.className}
-                style={props.style}
-                component={component}
-            />
-        )
-    } else {
-        return <></>
-    }
-}
-
-export async function loadLayoutMenus(response: any) {
-    if (response.success) {
-        let children = response.data.children;
-        if (children === null) {
-            return [];
-        }
-        const fetchMenu = (data: any) => {
-            data.icon = <MenuIcon icon={data.icon}/>;
-            data.children = data.children || [];
-            data.children.forEach((item: any) => {
-                fetchMenu(item);
-            });
-            return data;
-        }
-        children = children.map((item: any) => fetchMenu(item));
-        return children;
-    } else {
-        return [];
-    }
-}
-
-export async function loadLayoutMenuAuthentications(response: any) {
-    if (response.success) {
-        let children = response.data.children;
-        if (children === null) {
-            return [];
-        }
-        const authorities: string[] = [];
-        const fetchAuthorities = (data: any) => {
-            authorities.push(data.path);
-            if (data.children) {
-                data.children.forEach((item: any) => {
-                    fetchAuthorities(item);
-                });
-            }
-        }
-        children.forEach((element: any) => {
-            fetchAuthorities(element);
-        });
-        return authorities;
-    }
-    return [];
-}
-
-export default MenuIcon;
\ No newline at end of file
diff --git a/admin-pro-ui/src/components/flow/PostponedFormView.tsx b/admin-ui/src/components/flow/PostponedFormView.tsx
similarity index 100%
rename from admin-pro-ui/src/components/flow/PostponedFormView.tsx
rename to admin-ui/src/components/flow/PostponedFormView.tsx
diff --git a/admin-pro-ui/src/components/flow/UserSelectView.tsx b/admin-ui/src/components/flow/UserSelectView.tsx
similarity index 100%
rename from admin-pro-ui/src/components/flow/UserSelectView.tsx
rename to admin-ui/src/components/flow/UserSelectView.tsx
diff --git a/admin-pro-ui/src/components/flow/register.tsx b/admin-ui/src/components/flow/register.tsx
similarity index 100%
rename from admin-pro-ui/src/components/flow/register.tsx
rename to admin-ui/src/components/flow/register.tsx
diff --git a/admin-pro-ui/src/components/icons/index.tsx b/admin-ui/src/components/icons/index.tsx
similarity index 100%
rename from admin-pro-ui/src/components/icons/index.tsx
rename to admin-ui/src/components/icons/index.tsx
diff --git a/admin-ui/src/config/menus.tsx b/admin-ui/src/config/menus.tsx
index e1959ddb..a5dfd64c 100644
--- a/admin-ui/src/config/menus.tsx
+++ b/admin-ui/src/config/menus.tsx
@@ -15,116 +15,45 @@ export const menus = [
         icon: "SmileOutlined",
         page: 'welcome',
     },
-    {
-        path: '/salary',
-        name: '薪酬',
-        icon: "SmileOutlined",
-        page: 'salary',
-    },
-    {
-        path: '/user',
-        name: '用户列表',
-        icon: "UserOutlined",
-        page: 'user',
-    },
-    {
-        path: '/jar',
-        name: '权限',
-        icon: "SmileOutlined",
-        page: 'jar',
-    },
     {
         path: '/form',
         name: '表单',
-        icon: "SmileOutlined",
+        icon: "FormOutlined",
         page: 'form',
     },
+    {
+        path: '/mirco',
+        name: '微前端',
+        icon: "FormOutlined",
+        page: 'mirco',
+    },
     {
         path: '/flow',
         name: '流程',
-        icon: "SmileOutlined",
+        icon: "CiOutlined",
         routes: [
             {
                 path: '/flow/work',
                 name: '流程管理',
-                icon: "SmileOutlined",
                 page: 'flow/work',
             },
             {
                 path: '/flow/record',
                 name: '办理中心',
-                icon: "SmileOutlined",
                 page: 'flow/record',
             },
             {
                 path: '/flow/leave',
                 name: '请假管理',
-                icon: "SmileOutlined",
                 page: 'flow/leave',
             },
             {
                 path: '/flow/user',
                 name: '流程用户',
-                icon: "SmileOutlined",
                 page: 'flow/user',
             },
         ]
     },
-    {
-        path: '/node',
-        name: '节点管理',
-        icon: "NodeIndexOutlined",
-        page: 'node',
-    },
-    {
-        path: '/menu',
-        name: '菜单',
-        icon: "MenuOutlined",
-        roles: ['ROLE_ADMIN'],
-        routes: [
-            {
-                path: '/menu/index',
-                name: '菜单管理',
-                page: 'menu',
-            },
-        ],
-    },
-    {
-        path: '/redux',
-        name: '状态管理',
-        icon: "CrownFilled",
-        routes: [
-            {
-                path: '/redux/test1',
-                name: '测试页面1',
-                page: 'redux/test1',
-                roles: ['ROLE_ADMIN'],
-            },
-            {
-                path: '/redux/test2',
-                name: '测试页面2',
-                page: 'redux/test2',
-            },
-        ],
-    },
-    {
-        path: '/dynamic',
-        name: '动态加载',
-        icon: "CrownFilled",
-        roles: ['ROLE_ADMIN'],
-        routes: [
-            {
-                path: '/dynamic/test1',
-                name: '动态加载1',
-                page: 'dynamic/test1',
-            },
-            {
-                path: '/dynamic/test2',
-                name: '动态加载2',
-                page: 'dynamic/test2',
-            },
-        ],
-    },
 ]
 
 
diff --git a/admin-ui/src/config/register.component.tsx b/admin-ui/src/config/register.component.tsx
index 8503c03b..a996c631 100644
--- a/admin-ui/src/config/register.component.tsx
+++ b/admin-ui/src/config/register.component.tsx
@@ -1 +1 @@
-import "@/components/Flow/register/flow.register";
+import "@/components/flow/register";
diff --git a/admin-pro-ui/src/config/variables.scss b/admin-ui/src/config/variables.scss
similarity index 100%
rename from admin-pro-ui/src/config/variables.scss
rename to admin-ui/src/config/variables.scss
diff --git a/admin-ui/src/framework/ComponentBus/index.tsx b/admin-ui/src/framework/ComponentBus/index.tsx
deleted file mode 100644
index 6d7fbaf7..00000000
--- a/admin-ui/src/framework/ComponentBus/index.tsx
+++ /dev/null
@@ -1,14 +0,0 @@
-import React from "react";
-
-const componentBus = new Map<string, React.ComponentType<any>>();
-
-
-// 注册表操作方法
-export const registerComponent = (name: string, component: React.ComponentType<any>) => {
-    componentBus.set(name, component);
-};
-
-// 获取组件
-export const getComponent = (name: string): React.ComponentType<any> | undefined => {
-    return componentBus.get(name);
-}
diff --git a/admin-ui/src/framework/EventBus/index.ts b/admin-ui/src/framework/EventBus/index.ts
deleted file mode 100644
index d81efb0a..00000000
--- a/admin-ui/src/framework/EventBus/index.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-class GlobalEvent {
-    private static instance: GlobalEvent;
-    private events: Map<string, Function[]>;
-
-    private constructor() {
-        this.events = new Map();
-    }
-
-    public static getInstance(): GlobalEvent {
-        if (!this.instance) {
-            this.instance = new GlobalEvent();
-        }
-        return this.instance;
-    }
-
-    public on(eventName: string, callback: Function): void {
-        const callbacks = this.events.get(eventName) || [];
-        callbacks.push(callback);
-        this.events.set(eventName, callbacks);
-    }
-
-    public emit(eventName: string, ...args: any[]): void {
-        const callbacks = this.events.get(eventName);
-        if (callbacks) {
-            callbacks.forEach((callback) => {
-                try {
-                    callback(...args);
-                } catch (err) {
-                    console.error(
-                        `Error executing callback for event: ${eventName}`,
-                        err
-                    );
-                }
-            });
-        }
-    }
-
-    public off(eventName: string, callback?: Function): void {
-        if (callback) {
-            const callbacks = this.events.get(eventName);
-            if (callbacks) {
-                const callbackIndex = callbacks.indexOf(callback);
-                if (callbackIndex > -1) {
-                    callbacks.splice(callbackIndex, 1);
-                    if (callbacks.length === 0) {
-                        this.events.delete(eventName);
-                    } else {
-                        this.events.set(eventName, callbacks);
-                    }
-                }
-            }
-        } else {
-            this.events.delete(eventName);
-        }
-    }
-}
-
-export const events = GlobalEvent.getInstance();
diff --git a/admin-ui/src/framework/Routes/MenuRouteManager.tsx b/admin-ui/src/framework/Routes/MenuRouteManager.tsx
index 4f7b5de4..02cdc2dd 100644
--- a/admin-ui/src/framework/Routes/MenuRouteManager.tsx
+++ b/admin-ui/src/framework/Routes/MenuRouteManager.tsx
@@ -4,7 +4,7 @@ import {Route} from "react-router";
 import {menus} from "@/config/menus";
 import RoleControl from "@/utils/RoleControl";
 import {cloneDeep} from 'lodash';
-import Index from "@/components/View/MenuIcon";
+import Icons from "@/components/icons";
 
 const accessFilter = (menu: Menu): boolean => {
     if (menu.roles) {
@@ -119,7 +119,7 @@ export class MenuRouteManager {
         const menuMap = (menu: any) => {
             if (mapping) {
                 if (menu.icon) {
-                    menu.icon = <Index icon={menu.icon}/>
+                    menu.icon = <Icons icon={menu.icon}/>
                 }
                 if (menu.routes) {
                     menu.routes = menu.routes.map(menuMap);
diff --git a/admin-ui/src/framework/Routes/RoutesProvider.tsx b/admin-ui/src/framework/Routes/RoutesProvider.tsx
index 860b3c42..e7b06dfd 100644
--- a/admin-ui/src/framework/Routes/RoutesProvider.tsx
+++ b/admin-ui/src/framework/Routes/RoutesProvider.tsx
@@ -2,7 +2,7 @@ import React, {createContext, lazy, Suspense, useContext, useState} from 'react'
 import {createHashRouter, RouterProvider} from 'react-router-dom';
 import {loadRemoteComponent, loadRemoteScript} from "@/utils/dynamicLoader";
 import {loadPage} from "@/framework/DynamicLoad/PageLoader";
-import NotFound from "@/layout/pages/NotFound";
+import NotFound from "@/layout/NotFound";
 import Layout from "@/layout";
 import {useDispatch} from "react-redux";
 import {refresh} from "@/store/MenuSlice";
diff --git a/admin-pro-ui/src/gateway/default/Header.tsx b/admin-ui/src/gateway/default/Header.tsx
similarity index 100%
rename from admin-pro-ui/src/gateway/default/Header.tsx
rename to admin-ui/src/gateway/default/Header.tsx
diff --git a/admin-pro-ui/src/gateway/index.tsx b/admin-ui/src/gateway/index.tsx
similarity index 100%
rename from admin-pro-ui/src/gateway/index.tsx
rename to admin-ui/src/gateway/index.tsx
diff --git a/admin-ui/src/index.tsx b/admin-ui/src/index.tsx
index 73dd6242..3cbfbf44 100644
--- a/admin-ui/src/index.tsx
+++ b/admin-ui/src/index.tsx
@@ -8,6 +8,7 @@ import {ConfigProvider} from "antd";
 import zhCN from 'antd/es/locale/zh_CN';
 import {theme} from "@/config/theme";
 import './index.scss';
+import "@/config/register.component";
 
 const root = ReactDOM.createRoot(
     document.getElementById('root') as HTMLElement
diff --git a/admin-ui/src/json/flow.json b/admin-ui/src/json/flow.json
deleted file mode 100644
index 26e6cb64..00000000
--- a/admin-ui/src/json/flow.json
+++ /dev/null
@@ -1,166 +0,0 @@
-{
-  "nodes": [{
-    "id": "6fd8585a-2d74-4d82-a6bc-ff6b52a542fe",
-    "type": "start-node",
-    "x": 934,
-    "y": 183,
-    "properties": {
-      "name": "开始节点",
-      "code": "start",
-      "type": "NO_SIGN",
-      "view": "default",
-      "outOperatorMatcher": " return [operator.getId()];",
-      "outTrigger": "var leave = record.getBindData();\nif (leave.getLeaveDays() >= 3) {\n    return record.getNextNodeByCode(\"boss\");\n} else {\n    return record.getNextNodeByCode(\"depart\");\n}"
-    }
-  }, {
-    "id": "45d491c6-e8cf-4658-b5fd-3daf70ec0bd5",
-    "type": "node-node",
-    "x": 668,
-    "y": 364,
-    "properties": {
-      "name": "部门经理审批",
-      "code": "depart",
-      "type": "NO_SIGN",
-      "view": "default",
-      "outOperatorMatcher": "return [3];",
-      "outTrigger": " return record.getNextNodeByCode(\"depart\");",
-      "errTrigger": "",
-      "errOperatorMatcher": ""
-    }
-  }, {
-    "id": "c429698f-f17a-472a-81f0-7b62e540463b",
-    "type": "over-node",
-    "x": 986,
-    "y": 669,
-    "properties": {
-      "name": "结束节点",
-      "code": "over",
-      "type": "NO_SIGN",
-      "view": "default"
-    }
-  }, {
-    "id": "30910885-3326-4156-9e29-3299e2c49190",
-    "type": "node-node",
-    "x": 965,
-    "y": 445,
-    "properties": {
-      "name": "总经理审批",
-      "code": "boss",
-      "type": "NO_SIGN",
-      "view": "default",
-      "outOperatorMatcher": "return [4];",
-      "outTrigger": "if(record.getOpinion().isPass()){\n    return record.getNextNodeByCode(\"over\");\n}else{\n    return record.getPreNode();\n}",
-      "errTrigger": "",
-      "errOperatorMatcher": ""
-    }
-  }],
-  "edges": [{
-    "id": "ce303095-00b4-42da-b9e4-19fcfd096c91",
-    "type": "bezier",
-    "properties": {},
-    "sourceNodeId": "6fd8585a-2d74-4d82-a6bc-ff6b52a542fe",
-    "targetNodeId": "45d491c6-e8cf-4658-b5fd-3daf70ec0bd5",
-    "startPoint": {
-      "x": 934,
-      "y": 205.5
-    },
-    "endPoint": {
-      "x": 668,
-      "y": 341.5
-    },
-    "pointsList": [{
-      "x": 934,
-      "y": 205.5
-    }, {
-      "x": 934,
-      "y": 305.5
-    }, {
-      "x": 668,
-      "y": 241.5
-    }, {
-      "x": 668,
-      "y": 341.5
-    }]
-  }, {
-    "id": "d85b3419-a6ba-439d-a364-7d563877d786",
-    "type": "bezier",
-    "properties": {},
-    "sourceNodeId": "6fd8585a-2d74-4d82-a6bc-ff6b52a542fe",
-    "targetNodeId": "30910885-3326-4156-9e29-3299e2c49190",
-    "startPoint": {
-      "x": 934,
-      "y": 205.5
-    },
-    "endPoint": {
-      "x": 965,
-      "y": 422.5
-    },
-    "pointsList": [{
-      "x": 934,
-      "y": 205.5
-    }, {
-      "x": 934,
-      "y": 305.5
-    }, {
-      "x": 965,
-      "y": 322.5
-    }, {
-      "x": 965,
-      "y": 422.5
-    }]
-  }, {
-    "id": "a2b3e4d8-924f-4187-a1f7-581421d05c8e",
-    "type": "bezier",
-    "properties": {},
-    "sourceNodeId": "30910885-3326-4156-9e29-3299e2c49190",
-    "targetNodeId": "c429698f-f17a-472a-81f0-7b62e540463b",
-    "startPoint": {
-      "x": 965,
-      "y": 467.5
-    },
-    "endPoint": {
-      "x": 986,
-      "y": 646.5
-    },
-    "pointsList": [{
-      "x": 965,
-      "y": 467.5
-    }, {
-      "x": 965,
-      "y": 567.5
-    }, {
-      "x": 986,
-      "y": 546.5
-    }, {
-      "x": 986,
-      "y": 646.5
-    }]
-  }, {
-    "id": "1ae8f9a8-8146-4826-a27e-b721e875bc0e",
-    "type": "bezier",
-    "properties": {},
-    "sourceNodeId": "45d491c6-e8cf-4658-b5fd-3daf70ec0bd5",
-    "targetNodeId": "30910885-3326-4156-9e29-3299e2c49190",
-    "startPoint": {
-      "x": 768,
-      "y": 364
-    },
-    "endPoint": {
-      "x": 865,
-      "y": 445
-    },
-    "pointsList": [{
-      "x": 768,
-      "y": 364
-    }, {
-      "x": 868,
-      "y": 364
-    }, {
-      "x": 765,
-      "y": 445
-    }, {
-      "x": 865,
-      "y": 445
-    }]
-  }]
-}
diff --git a/admin-pro-ui/src/layout/AvatarHeader/index.tsx b/admin-ui/src/layout/AvatarHeader/index.tsx
similarity index 100%
rename from admin-pro-ui/src/layout/AvatarHeader/index.tsx
rename to admin-ui/src/layout/AvatarHeader/index.tsx
diff --git a/admin-pro-ui/src/layout/HeaderAction/index.tsx b/admin-ui/src/layout/HeaderAction/index.tsx
similarity index 100%
rename from admin-pro-ui/src/layout/HeaderAction/index.tsx
rename to admin-ui/src/layout/HeaderAction/index.tsx
diff --git a/admin-pro-ui/src/layout/HeaderDropdown/index.tsx b/admin-ui/src/layout/HeaderDropdown/index.tsx
similarity index 100%
rename from admin-pro-ui/src/layout/HeaderDropdown/index.tsx
rename to admin-ui/src/layout/HeaderDropdown/index.tsx
diff --git a/admin-pro-ui/src/layout/NotFound/index.tsx b/admin-ui/src/layout/NotFound/index.tsx
similarity index 100%
rename from admin-pro-ui/src/layout/NotFound/index.tsx
rename to admin-ui/src/layout/NotFound/index.tsx
diff --git a/admin-ui/src/layout/index.tsx b/admin-ui/src/layout/index.tsx
index 8d889d5a..2b3610a1 100644
--- a/admin-ui/src/layout/index.tsx
+++ b/admin-ui/src/layout/index.tsx
@@ -3,14 +3,13 @@ import React, {useEffect, useRef, useState} from 'react';
 import {Route, Routes} from "react-router";
 import {useNavigate} from "react-router-dom";
 import {MenuRouteManager} from "@/framework/Routes/MenuRouteManager";
-import AvatarHeader from "@/components/Layout/AvatarHeader";
-import {loadHeaderAction} from "@/components/Layout/HeaderAction";
+import AvatarHeader from "@/layout/AvatarHeader";
+import {loadHeaderAction} from "@/layout/HeaderAction";
 import {config} from "@/config/theme";
 import "./index.scss";
 import {useSelector} from "react-redux";
 import {RootState} from "@/store/Redux";
-import NotFound from "@/layout/pages/NotFound";
-import "@/config/register.component";
+import NotFound from "@/layout/NotFound";
 
 const welcomePath = config.welcomePath;
 const loginPath = config.loginPath;
diff --git a/admin-ui/src/layout/pages/Menu/index.scss b/admin-ui/src/layout/pages/Menu/index.scss
deleted file mode 100644
index 13f1d838..00000000
--- a/admin-ui/src/layout/pages/Menu/index.scss
+++ /dev/null
@@ -1,5 +0,0 @@
-.ant-tree-title{
-
-    cursor: auto !important;
-
-}
\ No newline at end of file
diff --git a/admin-ui/src/layout/pages/Menu/index.tsx b/admin-ui/src/layout/pages/Menu/index.tsx
deleted file mode 100644
index 48733d68..00000000
--- a/admin-ui/src/layout/pages/Menu/index.tsx
+++ /dev/null
@@ -1,276 +0,0 @@
-import React, {useEffect} from "react";
-import {ModalForm, PageContainer, ProCard, ProForm, ProFormText} from "@ant-design/pro-components";
-import {MenuRouteManager} from "@/framework/Routes/MenuRouteManager";
-import {Popconfirm, Space, Tree} from "antd";
-import {DeleteFilled, DownOutlined, EditFilled, PlusOutlined} from "@ant-design/icons";
-import {useRoutesContext} from "@/framework/Routes/RoutesProvider";
-import ProFormIcons from "@/components/Form/ProFormIcons";
-import Index from "@/components/View/MenuIcon";
-import "./index.scss";
-
-const Menu = () => {
-
-    const [root, setRoot] = React.useState<any>(null);
-
-    const [editorForm] = ProForm.useForm();
-    const [editorVisible, setEditorVisible] = React.useState(false);
-
-    const [addForm] = ProForm.useForm();
-    const [addVisible, setAddVisible] = React.useState(false);
-
-    const {addMenu, removeMenu, updateMenu} = useRoutesContext();
-
-
-    const handlerUpdate = (values: any) => {
-        updateMenu(values);
-        refreshTrees();
-        setEditorVisible(false);
-    }
-
-    const handlerAdd = (values: any) => {
-        addMenu(values);
-        refreshTrees();
-        setAddVisible(false);
-    }
-
-    const refreshTrees = () => {
-        const fetchMenu = (item: any) => {
-            if (item.icon) {
-                item.iconKey = item.icon;
-                item.icon = <Index icon={item.icon}/>
-            }
-            if (item.routes) {
-                item.routes.map(fetchMenu);
-                item.children = item.routes;
-            }
-            item.key = item.path;
-
-            if (item.name) {
-                item.title = (
-                    <Space>
-                        {item.name}
-
-                        <PlusOutlined
-                            onClick={() => {
-                                addForm.setFieldsValue({parentPath: item.path});
-                                setAddVisible(true);
-                            }}
-                        />
-
-                        <EditFilled
-                            onClick={() => {
-                                console.log(item);
-                                editorForm.setFieldsValue(item);
-                                editorForm.setFieldValue('icon', item.iconKey);
-                                setEditorVisible(true);
-                            }}
-                        />
-
-                        <Popconfirm title={"确认删除吗?"} onConfirm={() => {
-                            removeMenu(item.path);
-                            refreshTrees();
-                        }}>
-                            <DeleteFilled/>
-                        </Popconfirm>
-                    </Space>
-                );
-            }
-
-            return item;
-        }
-
-        const menus = MenuRouteManager.getInstance().getMenus(false);
-        menus.map(fetchMenu);
-
-        setRoot({
-            title: (
-                <Space>
-                    所有菜单
-
-                    <PlusOutlined
-                        onClick={() => {
-                            addForm.setFieldsValue({parentPath: ""});
-                            setAddVisible(true);
-                        }}
-                    />
-
-                </Space>
-            ),
-            key: 'root',
-            children: menus
-        });
-    };
-
-    useEffect(() => {
-        refreshTrees();
-    }, []);
-
-    return (
-        <PageContainer>
-            <ProCard
-                colSpan={8}
-                title={"菜单列表"}
-            >
-                {root && (
-                    <Tree
-                        showIcon
-                        selectable={false}
-                        defaultExpandAll
-                        switcherIcon={<DownOutlined/>}
-                        treeData={[root]}
-                    />
-                )}
-
-            </ProCard>
-
-            <ModalForm
-                form={editorForm}
-                open={editorVisible}
-                title={"新增菜单"}
-                modalProps={{
-                    onCancel: () => {
-                        setEditorVisible(false);
-                    }
-                }}
-                onFinish={async (values) => {
-                    updateMenu(values);
-                    return true;
-                }}
-            >
-                <ProFormText
-                    name={"name"}
-                    label={"名称"}
-                    rules={[
-                        {
-                            required: true,
-                            message: '名称是必填的'
-                        }
-                    ]}
-                />
-
-                <ProFormIcons
-                    name={"icon"}
-                    label={"图标"}
-                />
-
-                <ProFormText
-                    name={"path"}
-                    label={"路径"}
-                    rules={[
-                        {
-                            required: true,
-                            message: '路径是必填的'
-                        }
-                    ]}
-                />
-
-            </ModalForm>
-
-
-            <ModalForm
-                form={editorForm}
-                open={editorVisible}
-                title={"编辑菜单"}
-                modalProps={{
-                    onCancel: () => {
-                        setEditorVisible(false);
-                    }
-                }}
-                onFinish={async (values) => {
-                    console.log(values);
-                    handlerUpdate(values);
-                    return true;
-                }}
-            >
-                <ProFormText
-                    name={"name"}
-                    label={"名称"}
-                    rules={[
-                        {
-                            required: true,
-                            message: '名称是必填的'
-                        }
-                    ]}
-                />
-
-                <ProFormIcons
-                    name={"icon"}
-                    label={"图标"}
-                />
-
-                <ProFormText
-                    name={"path"}
-                    label={"路径"}
-                    rules={[
-                        {
-                            required: true,
-                            message: '路径是必填的'
-                        }
-                    ]}
-                />
-
-                <ProFormText
-                    name={"page"}
-                    label={"界面地址"}
-                />
-
-            </ModalForm>
-
-            <ModalForm
-                form={addForm}
-                open={addVisible}
-                title={"添加菜单"}
-                modalProps={{
-                    onCancel: () => {
-                        setAddVisible(false);
-                    }
-                }}
-                onFinish={async (values) => {
-                    handlerAdd(values);
-                    return true;
-                }}
-            >
-                <ProFormText
-                    name={"parentPath"}
-                    hidden={true}
-                />
-
-                <ProFormText
-                    name={"name"}
-                    label={"名称"}
-                    rules={[
-                        {
-                            required: true,
-                            message: '名称是必填的'
-                        }
-                    ]}
-                />
-
-                <ProFormIcons
-                    name={"icon"}
-                    label={"图标"}
-                />
-
-                <ProFormText
-                    name={"path"}
-                    label={"路径"}
-                    rules={[
-                        {
-                            required: true,
-                            message: '路径是必填的'
-                        }
-                    ]}
-                />
-
-                <ProFormText
-                    name={"page"}
-                    label={"界面地址"}
-                />
-
-            </ModalForm>
-
-        </PageContainer>
-    )
-}
-
-export default Menu;
\ No newline at end of file
diff --git a/admin-ui/src/layout/pages/NotFound/index.tsx b/admin-ui/src/layout/pages/NotFound/index.tsx
deleted file mode 100644
index eef73062..00000000
--- a/admin-ui/src/layout/pages/NotFound/index.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React from "react";
-import {Button, Result} from "antd";
-import {useNavigate} from "react-router";
-import {config} from "@/config/theme";
-import {useDispatch} from "react-redux";
-import {refresh} from "@/store/MenuSlice";
-
-const Index = () => {
-    const navigate = useNavigate();
-    const dispatch = useDispatch();
-
-    const goHome = () => {
-        navigate(config.welcomePath, {replace: true});
-        dispatch(refresh());
-    }
-
-    return (
-        <Result
-            status="404"
-            title="404"
-            subTitle="Sorry, the page you visited does not exist."
-            extra={(
-                <Button
-                    type="primary"
-                    onClick={goHome}
-                >
-                    Back Home
-                </Button>
-            )}
-        />
-    )
-}
-
-export default Index;
diff --git a/admin-ui/src/pages/dynamic/test1.tsx b/admin-ui/src/pages/dynamic/test1.tsx
deleted file mode 100644
index 17a8c52b..00000000
--- a/admin-ui/src/pages/dynamic/test1.tsx
+++ /dev/null
@@ -1,119 +0,0 @@
-import React, {Suspense, useState} from "react";
-import {Button, Col, Input, Row, Select, Space, Spin} from "antd";
-import ProFormCode from "@/components/Form/ProFormCode";
-import {PageContainer, ProForm} from "@ant-design/pro-components";
-import loadComponent from "@/framework/DynamicLoad/DynamicCode";
-import {useRoutesContext} from "@/framework/Routes/RoutesProvider";
-
-const Test1 = () => {
-
-    const [RemoteTestComponent, setRemoteTestComponent] = useState<React.ComponentType<any> | null>(null);
-    const {addMenu} = useRoutesContext();
-
-    const defaultCode =
-        `
-    const Test = () => {
-        return (
-            <div>
-                <h1>Test</h1>
-                <Button onClick={() => alert('Hello!')}>Click Me</Button>
-                <Input placeholder="Enter text" />
-                <Select defaultValue="option1" style={{ width: 120 }}>
-                    <Select.Option value="option1">Option 1</Select.Option>
-                    <Select.Option value="option2">Option 2</Select.Option>
-                </Select>
-            </div>
-        );
-    };
-    callback(Test);
-`;
-    const [code, setCode] = useState(defaultCode); // 直接在代码中返回 Test 组件实例
-
-    const executeCode = (codeStr: string, mode: string) => {
-        loadComponent(codeStr, [
-            Button,
-            Input,
-            Select
-        ]).then((Component) => {
-
-            setRemoteTestComponent(() => Component);
-
-            if (mode === 'menu') {
-                addMenu({
-                    path: '/test',
-                    name: '测试页面',
-                    icon: 'BugFilled',
-                    routes: [
-                        {
-                            path: '/test/test1',
-                            element: (
-                                <PageContainer>
-                                    <Component/>
-                                </PageContainer>
-                            ),
-                            name: '测试页面1',
-                        }
-                    ]
-                });
-            }
-        }).catch((error) => {
-            console.error(error);
-        });
-    };
-
-
-    return (
-        <PageContainer
-            title={"动态加载代码"}
-            extra={(
-                <Space>
-                    <Button
-                        type={"primary"}
-                        onClick={() => {
-                            executeCode(code, 'load');
-                        }}
-                    >
-                        Run Code
-                    </Button>
-
-                    <Button
-                        onClick={() => {
-                            executeCode(code, 'menu');
-                        }}
-                    >
-                        Add Menu
-                    </Button>
-
-
-                </Space>
-
-            )}
-        >
-            <Row>
-                <Col span={12}>
-                    <ProForm
-                        submitter={false}
-                    >
-                        <ProFormCode
-                            name={"code"}
-                            codeEditorProps={{
-                                style:{
-                                    height: 500
-                                }
-                            }}
-                        />
-                    </ProForm>
-                </Col>
-                <Col span={12}>
-                    {RemoteTestComponent && (
-                        <Suspense fallback={<Spin tip={"Loading"} size={"large"}/>}>
-                            <RemoteTestComponent/>
-                        </Suspense>
-                    )}
-                </Col>
-            </Row>
-        </PageContainer>
-    );
-};
-
-export default Test1;
diff --git a/admin-ui/src/pages/dynamic/test2.tsx b/admin-ui/src/pages/dynamic/test2.tsx
deleted file mode 100644
index d7890bfb..00000000
--- a/admin-ui/src/pages/dynamic/test2.tsx
+++ /dev/null
@@ -1,205 +0,0 @@
-import React, {Suspense, useEffect, useState} from "react";
-import {Button, Space, Spin} from "antd";
-import {ModalForm, PageContainer, ProForm, ProFormText} from "@ant-design/pro-components";
-import ProFormUploader from "@/components/Form/ProFormUploader";
-import {loadRemoteComponent, loadZipJsFileScript} from "@/utils/dynamicLoader";
-import {useRoutesContext} from "@/framework/Routes/RoutesProvider";
-import Role from "@/pages/role";
-
-
-const Test2 = () => {
-    const [RemoteTestComponent, setRemoteTestComponent] = useState<React.ComponentType<any> | null>(null);
-
-    const {addMenu} = useRoutesContext();
-
-    const [visible, setVisible] = useState(false);
-    const [mode, setMode] = useState('zip' as 'zip' | 'menu');
-
-    const [form] = ProForm.useForm();
-
-    useEffect(() => {
-        if(visible){
-            form.setFieldsValue({
-                scope: "MircoApp",
-                module: "./Header",
-            })
-        }
-    }, [visible]);
-
-    const loadComponent = (values: any) => {
-        return new Promise((resolve, reject) => {
-            const base64 = values.component;
-            const scope = values.scope;
-            const module = values.module;
-            loadZipJsFileScript(base64).then(() => {
-                loadRemoteComponent(scope, module).then((ComponentModule: any) => {
-                    const Component = ComponentModule.default || ComponentModule;
-                    resolve(Component);
-                }).catch(e => {
-                    reject(e);
-                });
-            });
-        });
-    }
-
-    const handlerLoadComponent = async (values: any) => {
-        loadComponent(values).then((Component:any) => {
-            if(Component) {
-                if (mode === 'menu') {
-                   addMenu({
-                        path: '/test',
-                        name:'测试页面',
-                        icon: 'BugFilled',
-                        routes:[
-                            {
-                                path: '/test/test1',
-                                element: (
-                                    <PageContainer>
-                                        <Component/>
-                                    </PageContainer>
-                                ),
-                                name:'测试页面1',
-                            }
-                        ]
-                    });
-                }else{
-                    setRemoteTestComponent(() => Component);
-                }
-            }
-            setVisible(false);
-        });
-    }
-
-    return (
-        <PageContainer>
-            <div
-                style={{
-                    display: 'flex',
-                    alignItems: 'center',
-                    flexDirection: 'column',
-                    gap: '50px',
-                }}
-            >
-                <h1
-                    style={{
-                        textAlign: 'center'
-                    }}
-                > 动态加载组件 </h1>
-
-                {RemoteTestComponent && (
-                    <Suspense fallback={<Spin tip={"Loading"} size={"large"}/>}>
-                        <RemoteTestComponent
-                            title={"Remote Component Header"}
-                            onClick={() => {
-                                alert('click');
-                            }}
-                        />
-                    </Suspense>
-                )}
-                <Space>
-                    <Button
-                        onClick={() => {
-                            setMode('zip');
-                            setVisible(true);
-                        }}
-                    >
-                        上传zip组件到本界面
-                    </Button>
-
-                    <Button
-                        onClick={() => {
-                            setMode('menu');
-                            setVisible(true);
-                        }}
-                    >
-                        上传zip组件到菜单
-                    </Button>
-
-                    <Button
-                        onClick={() => {
-                            addMenu({
-                                path: '/role',
-                                name:'权限管理',
-                                icon: 'BugFilled',
-                                routes:[
-                                    {
-                                        path: '/role/index',
-                                        element: (
-                                            <Role/>
-                                        ),
-                                        name:'权限测试',
-                                    }
-                                ]
-                            });
-                        }}
-                    >
-                        上传权限组件到菜单
-                    </Button>
-
-                </Space>
-
-
-                <ModalForm
-                    form={form}
-                    title={"上传zip组件"}
-                    open={visible}
-                    modalProps={{
-                        onCancel: () => {
-                            setVisible(false);
-                        },
-                        destroyOnClose: true
-                    }}
-                    onFinish={handlerLoadComponent}
-                >
-                    <ProFormText
-                        name={"component"}
-                        hidden={true}
-                    />
-
-                    <ProFormText
-                        name={"scope"}
-                        label={"scope"}
-                        rules={[
-                            {
-                                required: true,
-                                message: "scope is required"
-                            }
-                        ]}
-                    />
-
-                    <ProFormText
-                        name={"module"}
-                        label={"module"}
-                        rules={[
-                            {
-                                required: true,
-                                message: "module is required"
-                            }
-                        ]}
-                    />
-
-                    <ProFormUploader
-                        label={"组件文件包"}
-                        name={"upload"}
-                        max={1}
-                        accept={".zip"}
-                        onChange={({file}) => {
-                            if (file.response) {
-                                form.setFieldValue('component', file.response);
-                            }
-                        }}
-                        rules={[
-                            {
-                                required: true,
-                                message: "upload zip file"
-                            }
-                        ]}
-                    />
-
-                </ModalForm>
-            </div>
-        </PageContainer>
-    )
-}
-
-export default Test2;
diff --git a/admin-ui/src/pages/flow/leave/LeaveForm.tsx b/admin-ui/src/pages/flow/leave/LeaveForm.tsx
index 718b28fe..8f1cfbc4 100644
--- a/admin-ui/src/pages/flow/leave/LeaveForm.tsx
+++ b/admin-ui/src/pages/flow/leave/LeaveForm.tsx
@@ -1,132 +1,51 @@
 import React, {useEffect} from "react";
-import {ProForm, ProFormDigit, ProFormText, ProFormTextArea} from "@ant-design/pro-components";
-import {EVENT_CLOSE_RESULT_VIEW, EVENT_RELOAD_DATA, FlowFormViewProps} from "@/components/Flow/flow/types";
-import {Button} from "antd";
-import {useSelector} from "react-redux";
-import {FlowReduxState} from "@/components/Flow/store/FlowSlice";
-
+import {FlowFormViewProps} from "@codingapi/ui-framework";
+import {Form,FormInput,FormTextArea} from "@codingapi/form-pc";
+import {ValidateUtils} from "@codingapi/ui-framework";
 
 const LeaveForm: React.FC<FlowFormViewProps> = (props) => {
 
-    // 审批意见输入框展示状态
-    const opinionEditorVisible = useSelector((state: FlowReduxState) => state.flow.opinionEditorVisible);
-
-    useEffect(() => {
-        if (props.visible) {
-            console.log('init props.visible ');
-            props.form.resetFields();
-            props.form.setFieldsValue(props.data);
-
-            // 关闭意见输入框,仅当在开始节点关闭
-            if (props.flowData?.getNodeCode() === 'start') {
-                props.opinionEditorVisible && props.opinionEditorVisible(false);
-            } else {
-                props.opinionEditorVisible && props.opinionEditorVisible(true);
-            }
-        }
-    }, [props.visible]);
-
-    const eventKey = props.eventKey;
-
-    const [visible, setVisible] = React.useState(false);
-
     useEffect(() => {
-        if (eventKey === 'test') {
-            console.log("点击了自定义事件", eventKey);
-            setVisible(true);
-        }
-
-        // 当流程审批反馈结果关闭时，重新加载数据
-        if (eventKey == EVENT_CLOSE_RESULT_VIEW && props.flowData?.getNodeCode() === 'start') {
-            // 重新加载数据
-            console.log("重新加载数据");
-            props.handlerClick && props.handlerClick({type: "RELOAD"});
+        if (props.dataVersion && props.data) {
+            console.log('data',props.data);
+            props.form?.setFieldsValue({
+                ...props.data
+            });
         }
-
-        if (eventKey == EVENT_RELOAD_DATA) {
-            props.form.resetFields();
-            props.form.setFieldsValue(props.data);
-        }
-    }, [eventKey]);
-
-
-    useEffect(() => {
-        setTimeout(() => {
-            console.log('flowData recordId', props.flowData?.getRecordId());
-        }, 100)
-    }, [props.flowData]);
-
+    }, [props.dataVersion]);
 
     return (
-        <ProForm
+        <Form
             form={props.form}
-            submitter={false}
+            layout={"vertical"}
         >
 
-            <ProFormText
+            <FormInput
                 name={"id"}
                 hidden={true}
             />
 
-            <ProFormText
+            <FormInput
                 name={"username"}
                 hidden={true}
             />
 
-            <ProFormDigit
+            <FormInput
                 name={"days"}
                 label={"请假天数"}
-                fieldProps={{
-                    step: 1
-                }}
-                rules={[
-                    {
-                        required: true,
-                        message: "请输入请假天数"
-                    }
-                ]}
+               inputType={"number"}
+               required={true}
+                validateFunction={ValidateUtils.validateNotEmpty}
             />
 
-            <ProFormTextArea
+            <FormTextArea
                 name={"desc"}
                 label={"请假原因"}
-                rules={[
-                    {
-                        required: true,
-                        message: "请输入请假原因"
-                    }
-                ]}
+                required={true}
+                validateFunction={ValidateUtils.validateNotEmpty}
             />
 
-            <Button
-                onClick={() => {
-                    props.opinionEditorVisible && props.opinionEditorVisible(!opinionEditorVisible);
-                }}
-            >
-                意见输入框
-            </Button>
-
-            {visible && (
-                <Button
-                    onClick={() => {
-                        props.setRequestLoading && props.setRequestLoading(true);
-                        setTimeout(() => {
-                            setVisible(false);
-                            props.setRequestLoading && props.setRequestLoading(false);
-                        }, 1000)
-                    }}
-                >点击了自定义事件</Button>
-            )}
-
-            <Button
-                onClick={() => {
-                    const recordId = props.flowData?.getRecordId();
-                    alert(recordId);
-                }}
-            >getRecordId</Button>
-
-
-        </ProForm>
+        </Form>
     )
 }
 
diff --git a/admin-ui/src/pages/flow/leave/index.tsx b/admin-ui/src/pages/flow/leave/index.tsx
index bfc61a8d..bd1470fb 100644
--- a/admin-ui/src/pages/flow/leave/index.tsx
+++ b/admin-ui/src/pages/flow/leave/index.tsx
@@ -1,11 +1,9 @@
 import React from "react";
-import Page from "@/components/Layout/Page";
 import {ActionType, PageContainer, ProTable} from "@ant-design/pro-components";
 import {list} from "@/api/leave";
 import {Button} from "antd";
-import FlowView from "@/components/Flow/flow";
 import LeaveForm from "@/pages/flow/leave/LeaveForm";
-
+import {FlowModelView} from "@codingapi/flow-pc";
 
 const LeavePage = () => {
 
@@ -37,37 +35,35 @@ const LeavePage = () => {
 
     return (
         <PageContainer>
-            <Page>
-                <ProTable
-                    actionRef={actionRef}
-                    toolBarRender={() => [
-                        <Button
-                            type={"primary"}
-                            onClick={() => {
-                                setVisible(true);
-                            }}
-                        >发起请假</Button>
-                    ]}
-                    columns={columns}
-                    search={false}
-                    rowKey={"id"}
-                    request={async (params, sort, filter) => {
-                        return list(params, sort, filter, []);
-                    }}
-                />
+            <ProTable
+                actionRef={actionRef}
+                toolBarRender={() => [
+                    <Button
+                        type={"primary"}
+                        onClick={() => {
+                            setVisible(true);
+                        }}
+                    >发起请假</Button>
+                ]}
+                columns={columns}
+                search={false}
+                rowKey={"id"}
+                request={async (params, sort, filter) => {
+                    return list(params, sort, filter, []);
+                }}
+            />
 
-                <FlowView
-                    visible={visible}
-                    setVisible={setVisible}
-                    view={LeaveForm}
-                    workCode={"leave"}
-                    formParams={{
-                        clazzName: 'com.codingapi.example.infra.flow.form.LeaveForm',
-                        username: username
-                    }}
-                />
+            <FlowModelView
+                visible={visible}
+                setVisible={setVisible}
+                view={LeaveForm}
+                workCode={"leave"}
+                formParams={{
+                    clazzName: 'com.codingapi.example.infra.flow.form.LeaveForm',
+                    username: username
+                }}
+            />
 
-            </Page>
         </PageContainer>
     )
 }
diff --git a/admin-ui/src/pages/flow/record/index.tsx b/admin-ui/src/pages/flow/record/index.tsx
index ac873cbe..fada0816 100644
--- a/admin-ui/src/pages/flow/record/index.tsx
+++ b/admin-ui/src/pages/flow/record/index.tsx
@@ -12,13 +12,13 @@ import {
 import moment from "moment";
 import {message, Tabs} from "antd";
 import "./index.scss";
-import FlowView from "@/components/Flow/flow";
 import LeaveForm from "@/pages/flow/leave/LeaveForm";
+import {FlowModelView} from "@codingapi/flow-pc";
 
 const FlowRecordPage = () => {
 
     const [flowViewVisible, setFlowViewVisible] = React.useState(false);
-    const [currentId, setCurrentId] = React.useState<number>(0);
+    const [currentId, setCurrentId] = React.useState<string>('');
     const [reviewVisible, setReviewVisible] = React.useState(false);
 
 
@@ -31,7 +31,7 @@ const FlowRecordPage = () => {
     const allTodoActionRef = React.useRef<ActionType>();
 
 
-    const handlerUrgeFlow = (recordId:any) => {
+    const handlerUrgeFlow = (recordId: any) => {
         const body = {
             recordId,
         }
@@ -61,9 +61,9 @@ const FlowRecordPage = () => {
         {
             title: '标题',
             dataIndex: 'title',
-            render:(value:any,record:any)=>{
+            render: (value: any, record: any) => {
                 return (
-                    <div dangerouslySetInnerHTML={{ __html: value }}></div>
+                    <div dangerouslySetInnerHTML={{__html: value}}></div>
                 );
             }
         },
@@ -171,7 +171,7 @@ const FlowRecordPage = () => {
     ] as any[];
 
 
-    const reloadTable = ()=>{
+    const reloadTable = () => {
         if (key === 'todo') {
             todoActionRef.current?.reload();
         }
@@ -213,7 +213,7 @@ const FlowRecordPage = () => {
                                 search={false}
                                 columns={columns}
                                 rowClassName={(record) => {
-                                    return record.read?"record-read":"record-unread";
+                                    return record.read ? "record-read" : "record-unread";
                                 }}
                                 request={async (params, sort, filter) => {
                                     return findTodoByOperatorId(params, sort, filter, []);
@@ -230,7 +230,7 @@ const FlowRecordPage = () => {
                                 search={false}
                                 columns={columns}
                                 rowClassName={(record) => {
-                                    return record.read?"record-read":"record-unread";
+                                    return record.read ? "record-read" : "record-unread";
                                 }}
                                 request={async (params, sort, filter) => {
                                     return findDoneByOperatorId(params, sort, filter, []);
@@ -247,7 +247,7 @@ const FlowRecordPage = () => {
                                 search={false}
                                 columns={columns}
                                 rowClassName={(record) => {
-                                    return record.read?"record-read":"record-unread";
+                                    return record.read ? "record-read" : "record-unread";
                                 }}
                                 request={async (params, sort, filter) => {
                                     return findInitiatedByOperatorId(params, sort, filter, []);
@@ -264,7 +264,7 @@ const FlowRecordPage = () => {
                                 search={false}
                                 columns={columns}
                                 rowClassName={(record) => {
-                                    return record.read?"record-read":"record-unread";
+                                    return record.read ? "record-read" : "record-unread";
                                 }}
                                 request={async (params, sort, filter) => {
                                     return findTimeoutTodoByOperatorId(params, sort, filter, []);
@@ -282,7 +282,7 @@ const FlowRecordPage = () => {
                                 search={false}
                                 columns={columns}
                                 rowClassName={(record) => {
-                                    return record.read?"record-read":"record-unread";
+                                    return record.read ? "record-read" : "record-unread";
                                 }}
                                 request={async (params, sort, filter) => {
                                     return findPostponedTodoByOperatorId(params, sort, filter, []);
@@ -299,7 +299,7 @@ const FlowRecordPage = () => {
                                 search={false}
                                 columns={columns}
                                 rowClassName={(record) => {
-                                    return record.read?"record-read":"record-unread";
+                                    return record.read ? "record-read" : "record-unread";
                                 }}
                                 request={async (params, sort, filter) => {
                                     return findAllByOperatorId(params, sort, filter, []);
@@ -310,17 +310,16 @@ const FlowRecordPage = () => {
                 ]}
             />
 
-            <FlowView
-                id={currentId}
+
+            <FlowModelView
                 visible={flowViewVisible}
-                review={reviewVisible}
                 setVisible={setFlowViewVisible}
+                id={currentId}
                 view={{
                     'default': LeaveForm
                 }}
             />
 
-
         </PageContainer>
     )
 }
diff --git a/admin-ui/src/pages/flow/user/index.tsx b/admin-ui/src/pages/flow/user/index.tsx
index a25b0ab9..d52717ec 100644
--- a/admin-ui/src/pages/flow/user/index.tsx
+++ b/admin-ui/src/pages/flow/user/index.tsx
@@ -1,19 +1,11 @@
 import React, {useRef} from "react";
-import Page from "@/components/Layout/Page";
-import {
-    ActionType,
-    ModalForm,
-    PageContainer,
-    ProForm,
-    ProFormSwitch,
-    ProFormText,
-    ProTable
-} from "@ant-design/pro-components";
+import {ActionType, PageContainer, ProTable} from "@ant-design/pro-components";
 import {changeManager, entrust, list, remove, removeEntrust, save} from "@/api/user";
-import {Button, message, Popconfirm, Space} from "antd";
+import {Button, message, Modal, Popconfirm, Space} from "antd";
 import {DeleteOutlined, SettingOutlined} from "@ant-design/icons";
 import UserSelect from "@/pages/flow/user/select";
-
+import {Form,FormInput,FormSwitch} from "@codingapi/form-pc";
+import {ValidateUtils} from "@codingapi/ui-framework";
 
 const UserPage = () => {
 
@@ -23,7 +15,7 @@ const UserPage = () => {
     const [user, setUser] = React.useState<any>({});
 
     const actionRef = useRef<ActionType>();
-    const [form] = ProForm.useForm();
+    const form = Form.useForm();
 
     const handleSave = (values: any) => {
         save(values).then(res => {
@@ -168,7 +160,6 @@ const UserPage = () => {
 
     return (
         <PageContainer>
-            <Page>
                 <ProTable
                     actionRef={actionRef}
                     toolBarRender={() => [
@@ -188,67 +179,58 @@ const UserPage = () => {
                     }}
                 />
 
-                <ModalForm
-                    form={form}
+                <Modal
                     title={"编辑用户"}
                     open={visible}
-                    modalProps={{
-                        onCancel: () => {
-                            setVisible(false);
-                        },
-                        onClose: () => {
-                            setVisible(false);
-                        },
-                        destroyOnClose: true
+                    onClose={()=>{
+                        setVisible(false);
+                    }}
+                    onCancel={()=>{
+                        setVisible(false);
                     }}
-                    onFinish={async (values) => {
-                        handleSave(values);
+                    onOk={async ()=>{
+                        await form.submit();
                     }}
                 >
-                    <ProFormText
-                        name={"id"}
-                        hidden={true}
-                    />
-
-                    <ProFormText
-                        name={"name"}
-                        label={"姓名"}
-                        rules={[
-                            {
-                                required: true,
-                                message: "请输入姓名"
-                            }
-                        ]}
-                    />
-
-                    <ProFormText
-                        name={"username"}
-                        label={"登录账号"}
-                        rules={[
-                            {
-                                required: true,
-                                message: "请输入登录账号"
-                            }
-                        ]}
-                    />
-
-                    <ProFormText
-                        name={"password"}
-                        label={"登录密码"}
-                        rules={[
-                            {
-                                required: true,
-                                message: "请输入登录密码"
-                            }
-                        ]}
-                    />
-
-                    <ProFormSwitch
-                        name={"flowManager"}
-                        label={"是否流程管理员"}
-                    />
-
-                </ModalForm>
+                    <Form
+                        layout={"vertical"}
+                        form={form}
+                        onFinish={async (values) => {
+                            handleSave(values);
+                        }}
+                    >
+                        <FormInput
+                            name={"id"}
+                            hidden={true}
+                        />
+
+                        <FormInput
+                            name={"name"}
+                            label={"姓名"}
+                            required={true}
+                            validateFunction={ValidateUtils.validateNotEmpty}
+                        />
+
+                        <FormInput
+                            name={"username"}
+                            label={"登录账号"}
+                            required={true}
+                            validateFunction={ValidateUtils.validateNotEmpty}
+                        />
+
+                        <FormInput
+                            name={"password"}
+                            label={"登录密码"}
+                            required={true}
+                            validateFunction={ValidateUtils.validateNotEmpty}
+                        />
+
+                        <FormSwitch
+                            name={"flowManager"}
+                            label={"是否流程管理员"}
+                        />
+                    </Form>
+                </Modal>
 
                 <UserSelect
                     multiple={false}
@@ -263,7 +245,6 @@ const UserPage = () => {
                         }
                     }}
                 />
-            </Page>
         </PageContainer>
     )
 }
diff --git a/admin-ui/src/pages/flow/work/__test__/index.test.tsx b/admin-ui/src/pages/flow/work/__test__/index.test.tsx
deleted file mode 100644
index 30686478..00000000
--- a/admin-ui/src/pages/flow/work/__test__/index.test.tsx
+++ /dev/null
@@ -1,63 +0,0 @@
-import React from 'react';
-import {act, fireEvent, render, screen, waitFor} from "@testing-library/react";
-import FlowPage from "@/pages/flow/work";
-
-jest.mock('axios');
-
-// test description for the component
-describe('Welcome Component', () => {
-
-    test('renders with default initial value', async () => {
-
-        // render the component
-        render(
-            <FlowPage/>
-        );
-
-        const flowTable = screen.getByTestId("flow-table");
-        expect(flowTable).toBeInTheDocument();
-
-        const flowAddBtn = screen.getByTestId("flow-add-btn");
-        expect(flowAddBtn).toBeInTheDocument();
-
-
-        await act(async () => {
-            fireEvent.click(flowAddBtn);
-        });
-
-        await waitFor(() => {
-            const flowEditor = screen.getByTestId("flow-editor");
-            expect(flowEditor).toBeInTheDocument();
-        });
-
-        const inputTitle = screen.getByLabelText('标题');
-        const inputCode = screen.getByLabelText('编码');
-        const inputDescription = screen.getByLabelText('描述');
-        const inputPostponedMax = screen.getByLabelText('最大延期次数');
-        const inputSkipIfSameApprover = screen.getByLabelText('是否跳过相同审批人');
-        const submitButton = screen.getByTestId('flow-editor-submit');
-        expect(submitButton).toBeInTheDocument();
-
-
-        await act(async () => {
-            fireEvent.change(inputTitle, {target: {value: 'test'}});
-            expect(inputTitle).toHaveValue('test');
-            fireEvent.change(inputCode, {target: {value: 'test'}});
-            expect(inputCode).toHaveValue('test');
-            fireEvent.change(inputDescription, {target: {value: 'test'}});
-            expect(inputDescription).toHaveValue('test');
-            fireEvent.change(inputPostponedMax, {target: {value: '1'}});
-            expect(inputPostponedMax).toHaveValue('1');
-            fireEvent.change(inputSkipIfSameApprover, {target: {value: 'true'}});
-            expect(inputSkipIfSameApprover).toHaveValue('true');
-            fireEvent.click(submitButton);
-        });
-
-        await waitFor(() => {
-            // todo 不敢展示，却必须得展示才能正常
-            const submitButton = screen.getByTestId('flow-editor-submit');
-            expect(submitButton).toBeInTheDocument();
-        });
-
-    });
-});
diff --git a/admin-ui/src/pages/flow/work/index.tsx b/admin-ui/src/pages/flow/work/index.tsx
index 69d45222..4c0719b2 100644
--- a/admin-ui/src/pages/flow/work/index.tsx
+++ b/admin-ui/src/pages/flow/work/index.tsx
@@ -1,23 +1,17 @@
 import React from "react";
-import Flow, {FlowActionType} from "@/components/Flow";
-import {
-    ActionType,
-    ModalForm,
-    PageContainer,
-    ProForm,
-    ProFormDigit, ProFormSwitch,
-    ProFormText, ProFormTextArea,
-    ProTable
-} from "@ant-design/pro-components";
+import {Flow,FlowActionType} from "@codingapi/flow-pc";
+import {ActionType, PageContainer, ProTable} from "@ant-design/pro-components";
 import {changeState, copy, list, remove, save, schema} from "@/api/flow";
-import {Button, Drawer, message, Popconfirm, Space} from "antd";
+import {Button, Drawer, message, Modal, Popconfirm, Space} from "antd";
+import {Form,FormInput,FormTextArea,FormSwitch} from "@codingapi/form-pc";
+import {ValidateUtils} from "@codingapi/ui-framework";
 
 const FlowPage = () => {
 
     const [visible, setVisible] = React.useState(false);
     const [editorVisible, setEditorVisible] = React.useState(false);
     const flowActionType = React.useRef<FlowActionType>(null);
-    const [form] = ProForm.useForm();
+    const form = Form.useForm();
     const actionRef = React.useRef<ActionType>();
 
     const [current, setCurrent] = React.useState<any>(null);
@@ -181,7 +175,7 @@ const FlowPage = () => {
                             data-testid={"flow-add-btn"}
                             type={"primary"}
                             onClick={() => {
-                                form.resetFields();
+                                form.reset();
                                 setEditorVisible(true);
                             }}
                         >新增</Button>
@@ -197,77 +191,68 @@ const FlowPage = () => {
                 }}
             />
 
-            <ModalForm
+            <Modal
                 data-testid={"flow-editor"}
                 title="编辑流程"
-                form={form}
                 open={editorVisible}
-                modalProps={{
-                    destroyOnClose: true,
-                    onClose: () => setEditorVisible(false),
-                    onCancel: () => setEditorVisible(false),
+                destroyOnClose={true}
+                onClose={()=>{
+                    setEditorVisible(false)
+                }}
+                onCancel={()=>{
+                    setEditorVisible(false)
                 }}
-                submitter={{
-                    submitButtonProps:{
-                        "data-testid":"flow-editor-submit",
-                    },
+                onOk={async ()=>{
+                    await form.submit();
                 }}
-                onFinish={handlerSave}
             >
-                <ProFormText
-                    name={"id"}
-                    hidden={true}
-                />
 
-                <ProFormText
-                    name={"title"}
-                    label={"标题"}
-                    rules={[
-                        {
-                            required: true,
-                            message: "请输入标题"
-                        }
-                    ]}
-                />
+                <Form
+                    form={form}
+                    layout={"vertical"}
+                    onFinish={handlerSave}
+                >
+                    <FormInput
+                        name={"id"}
+                        hidden={true}
+                    />
 
-                <ProFormText
-                    name={"code"}
-                    label={"编码"}
-                    rules={[
-                        {
-                            required: true,
-                            message: "请输入编码"
-                        }
-                    ]}
-                />
+                    <FormInput
+                        name={"title"}
+                        label={"标题"}
+                        required={true}
+                        validateFunction={ValidateUtils.validateNotEmpty}
+                    />
 
-                <ProFormTextArea
-                    name={"description"}
-                    label={"描述"}
-                />
+                    <FormInput
+                        name={"code"}
+                        label={"编码"}
+                        required={true}
+                        validateFunction={ValidateUtils.validateNotEmpty}
+                    />
 
-                <ProFormDigit
-                    name={"postponedMax"}
-                    tooltip={"允许流程最大的延期次数"}
-                    label={"最大延期次数"}
-                    fieldProps={{
-                        step:1
-                    }}
-                    rules={[
-                        {
-                            required:true,
-                            message:'最大延期次数不能为空'
-                        }
-                    ]}
-                />
+                    <FormTextArea
+                        name={"description"}
+                        label={"描述"}
+                    />
 
-                <ProFormSwitch
-                    name={"skipIfSameApprover"}
-                    tooltip={"是否跳过相同审批人，默认为否"}
-                    label={"是否跳过相同审批人"}
-                />
+                    <FormInput
+                        name={"postponedMax"}
+                        tooltip={"允许流程最大的延期次数"}
+                        label={"最大延期次数"}
+                        inputType={'number'}
+                        required={true}
+                        validateFunction={ValidateUtils.validateNotEmpty}
+                    />
+
+                    <FormSwitch
+                        name={"skipIfSameApprover"}
+                        tooltip={"是否跳过相同审批人，默认为否"}
+                        label={"是否跳过相同审批人"}
+                    />
+                </Form>
 
-            </ModalForm>
+            </Modal>
 
 
             <Drawer
diff --git a/admin-ui/src/pages/form/index.tsx b/admin-ui/src/pages/form/index.tsx
index 7c204d0c..34650e78 100644
--- a/admin-ui/src/pages/form/index.tsx
+++ b/admin-ui/src/pages/form/index.tsx
@@ -1,103 +1,588 @@
 import React from 'react';
-import Page from "@/components/Layout/Page";
-import {Button, Form, Select, Space} from "antd";
+import {PageContainer} from "@ant-design/pro-components";
+import {Button, Col, message, Row} from "antd";
+import {
+    FormCascader,
+    FormCode,
+    FormColor,
+    FormDate,
+    FormRadio,
+    FormRate,
+    FormSelect,
+    FormSlider,
+    FormStepper,
+    FormSwitch,
+    FormTextArea,
+    FormUploader,
+    FormCheckbox,
+    FormCaptcha,
+    FormPassword,
+    FormInput,
+    Form
+} from "@codingapi/form-pc";
+import {FormInstance,FormField} from "@codingapi/ui-framework";
 
-const FormTest = () => {
 
-    const [form] = Form.useForm();
+const FooterButtons: React.FC<{ formInstance: FormInstance }> = ({formInstance}) => {
+    const data = {
+        user: {
+            name: '张三',
+            age: 18,
+            password: '123456',
+            code: '123',
+            checkbox: '1,2',
+            radio: '1',
+            rate: 3,
+            slider: 50,
+            switch: true,
+            textarea: '这是一段文本',
+            date: '2021-08-01',
+            cascader: '1,1-1,1-1-1',
+            select: '1,2',
+            avatar: 'c84fb304c180f61bb7db40efef7f85b7',
+            color: '#000000',
+            ideCode: 'console.log("hello world")'
+        }
+    }
 
     return (
-        <Page enablePageContainer={true}>
-            <div className="App">
-                <Form
-                    form={form}
-                    onFinish={async (values)=>{
-                        console.log(values);
-                    }}
-                >
-                    <Form.Item
-                        name={"test"}
-                        label={"测试"}
-                        normalize={(value)=>{
-                            // 自定义格式化值的方式
-                            return value.join(',');
-                        }}
-                        getValueProps={(value)=>{
-                            // 自定义设置值的方式，这里是将字符串转为数组
-                            if(value) {
-                                const arr = value.split(',');
-                                return {
-                                    value: arr
-                                };
+        <div
+            style={{
+                display: "grid",
+                gridTemplateColumns: "1fr 1fr",
+                gridRowGap: "10px",
+                gridColumnGap: "10px"
+            }}
+        >
+            <Button
+                onClick={async () => {
+                    const name = formInstance.getFieldValue(["user", "name"])
+                    message.success(name);
+                }}
+            >获取姓名</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.setFieldValue(["user", "name"], "123")
+                }}
+            >设置姓名</Button>
+
+            <Button
+                onClick={async () => {
+                    await formInstance.validate();
+                }}
+            >验证表单</Button>
+
+            <Button
+                onClick={async () => {
+                    await formInstance.submit();
+                }}
+            >提交表单</Button>
+
+            <Button
+                onClick={async () => {
+                    const values = formInstance.getFieldsValue();
+                    message.success(JSON.stringify(values));
+                }}
+            >获取表单值</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.reset();
+                }}
+            >重置表单</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.setFieldsValue(data);
+                }}
+            >表单赋值</Button>
+            <div></div>
+
+            <Button
+                onClick={async () => {
+                    formInstance.enable(["user", "name"]);
+                }}
+            >启用姓名字段</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.disable(["user", "name"]);
+                }}
+            >禁用姓名字段</Button>
+
+
+            <Button
+                onClick={async () => {
+                    formInstance.hidden(["user", "name"]);
+                }}
+            >隐藏姓名字段</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.show(["user", "name"]);
+                }}
+            >展示姓名字段</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.remove(["user", "name"]);
+                }}
+            >删除姓名字段</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.create({
+                        props: {
+                            required: true,
+                            name: ['user', 'name'],
+                            label: '姓名',
+                            placeholder: '请输入姓名',
+                            validateFunction: async (content) => {
+                                const value = content.value;
+                                if (value) {
+                                    return []
+                                }
+                                return ['姓名不能为空']
                             }
-                            return value;
-                        }}
+                        },
+                        type: 'input'
+                    }, 0);
+                }}
+            >添加姓名字段</Button>
+
+        </div>
+    )
+}
+
+const FormPage = () => {
+    const leftFormInstance = Form.useForm();
+    const rightFormInstance = Form.useForm();
+
+    const fields = [
+        {
+            type: 'input',
+            props: {
+                required: true,
+                name: ['user', 'name'],
+                label: '姓名',
+                placeholder: '请输入姓名',
+                validateFunction: async (content) => {
+                    const value = content.value;
+                    if (value) {
+                        return []
+                    }
+                    return ['姓名不能为空']
+                }
+            }
+        },
+        {
+            type: 'stepper',
+            props: {
+                required: true,
+                name: ['user', 'age'],
+                label: '年龄',
+                placeholder: '请输入年龄',
+            }
+        },
+        {
+            type: 'password',
+            props: {
+                required: true,
+                name: ['user', 'password'],
+                label: '银行卡密码',
+                placeholder: '请输入银行卡密码',
+                validateFunction: async (content) => {
+                    const value = content.value;
+                    if (value) {
+                        return []
+                    }
+                    return ['银行卡密码不能为空']
+                }
+            }
+        },
+        {
+            type: 'captcha',
+            props: {
+                required: true,
+                name: ['user', 'code'],
+                label: '银行卡验证码',
+                placeholder: '请输入银行卡验证码',
+                onCaptchaRefresh: async () => {
+                    console.log('refresh captcha')
+                    return {
+                        url: '/captcha.jpeg',
+                        code: '123'
+                    }
+                }
+            }
+        },
+        {
+            type: 'checkbox',
+            props: {
+                required: true,
+                name: ['user', 'checkbox'],
+                label: '复选框',
+                options: [
+                    {label: '选项1', value: '1'},
+                    {label: '选项2', value: '2'},
+                    {label: '选项3', value: '3'},
+                ]
+            }
+        },
+        {
+            type: 'radio',
+            props: {
+                required: true,
+                name: ['user', 'radio'],
+                label: '单选框',
+                options: [
+                    {label: '选项1', value: '1'},
+                    {label: '选项2', value: '2'},
+                    {label: '选项3', value: '3'},
+                ]
+            }
+        },
+        {
+            type: 'rate',
+            props: {
+                required: true,
+                name: ['user', 'rate'],
+                label: '评分',
+            }
+        },
+        {
+            type: 'slider',
+            props: {
+                required: true,
+                name: ['user', 'slider'],
+                label: '滑块',
+                sliderPopover: true
+            }
+        },
+        {
+            type: 'switch',
+            props: {
+                required: true,
+                name: ['user', 'switch'],
+                label: '开关',
+            }
+        },
+        {
+            type: 'textarea',
+            props: {
+                required: true,
+                name: ['user', 'textarea'],
+                label: '文本域',
+            }
+        },
+        {
+            type: 'date',
+            props: {
+                required: true,
+                name: ['user', 'date'],
+                label: '日期',
+            }
+        },
+        {
+            type: 'cascader',
+            props: {
+                required: true,
+                name: ['user', 'cascader'],
+                label: '级联选择',
+                options: [
+                    {
+                        label: '选项1',
+                        value: '1',
+                        children: [
+                            {
+                                label: '选项1-1',
+                                value: '1-1',
+                                children: [
+                                    {
+                                        label: '选项1-1-1',
+                                        value: '1-1-1',
+                                    },
+                                    {
+                                        label: '选项1-1-2',
+                                        value: '1-1-2',
+                                    },
+                                ]
+                            },
+                            {
+                                label: '选项1-2',
+                                value: '1-2',
+                            },
+                        ]
+                    },
+                    {
+                        label: '选项2',
+                        value: '2',
+                        children: [
+                            {
+                                label: '选项2-1',
+                                value: '2-1',
+                            },
+                            {
+                                label: '选项2-2',
+                                value: '2-2',
+                            },
+                        ]
+                    },
+                ]
+            }
+        },
+        {
+            type: 'select',
+            props: {
+                required: true,
+                name: ['user', 'select'],
+                label: '选择器',
+                selectMultiple: true,
+                options: [
+                    {label: '选项1', value: '1'},
+                    {label: '选项2', value: '2'},
+                    {label: '选项3', value: '3'},
+                ]
+            }
+        },
+        {
+            type: 'uploader',
+            props: {
+                required: true,
+                name: ['user', 'avatar'],
+                label: '头像',
+            }
+        },
+        {
+            type: 'color',
+            props: {
+                required: true,
+                name: ['user', 'color'],
+                label: '颜色',
+            }
+        },
+        {
+            type: 'code',
+            props: {
+                required: true,
+                name: ['user', 'ideCode'],
+                label: '代码',
+            }
+        },
+    ] as FormField[];
+
+    return (
+        <PageContainer>
+            <Row gutter={[24, 24]}>
+                <Col span={12}>
+                    <Form
+                        form={leftFormInstance}
+                        layout={"horizontal"}
+                        footer={(
+                            <FooterButtons
+                                formInstance={leftFormInstance}
+                            />
+                        )}
                     >
-                        {/*
-                            对于下属组件，需要提供以下属性：
-                            value: 1
-                            onChange: (value: any) => void
-                            通过这两个属性就可以实现双向绑定
-                        */}
-                        <Select
-                            mode={"multiple"}
+                        <FormInput
+                            required={true}
+                            name={["user", "name"]}
+                            label={"姓名"}
+                            placeholder={"请输入姓名"}
+                            validateFunction={async (content) => {
+                                const value = content.value;
+                                if (value) {
+                                    return []
+                                }
+                                return ['姓名不能为空']
+                            }}
+                        />
+
+                        <FormStepper
+                            required={true}
+                            name={["user", "age"]}
+                            label={"年龄"}
+                            placeholder={"请输入年龄"}
+                        />
+
+                        <FormPassword
+                            required={true}
+                            name={["user", "password"]}
+                            label={"银行卡密码"}
+                            placeholder={"请输入银行卡密码"}
+                            validateFunction={async (content) => {
+                                const value = content.value;
+                                if (value) {
+                                    return []
+                                }
+                                return ['银行卡密码不能为空']
+                            }}
+                        />
+
+                        <FormCaptcha
+                            required={true}
+                            name={["user", "code"]}
+                            label={"银行卡验证码"}
+                            placeholder={"请输入银行卡验证码"}
+                            onCaptchaRefresh={async () => {
+                                console.log('refresh captcha')
+                                return {
+                                    url: '/captcha.jpeg',
+                                    code: '123'
+                                }
+                            }}
+                        />
+
+                        <FormCheckbox
+                            required={true}
+                            name={["user", "checkbox"]}
+                            label={"复选框"}
+                            options={[
+                                {label: '选项1', value: '1'},
+                                {label: '选项2', value: '2'},
+                                {label: '选项3', value: '3'},
+                            ]}
+                        />
+
+                        <FormRadio
+                            required={true}
+                            name={["user", "radio"]}
+                            label={"单选框"}
+                            options={[
+                                {label: '选项1', value: '1'},
+                                {label: '选项2', value: '2'},
+                                {label: '选项3', value: '3'},
+                            ]}
+                        />
+
+                        <FormRate
+                            required={true}
+                            name={["user", "rate"]}
+                            label={"评分"}
+                        />
+
+                        <FormSlider
+                            required={true}
+                            name={["user", "slider"]}
+                            label={"滑块"}
+                            sliderPopover={true}
+                        />
+
+                        <FormSwitch
+                            required={true}
+                            name={["user", "switch"]}
+                            label={"开关"}
+                        />
+
+                        <FormTextArea
+                            required={true}
+                            name={["user", "textarea"]}
+                            label={"文本域"}
+                        />
+
+                        <FormDate
+                            required={true}
+                            name={["user", "date"]}
+                            label={"日期"}
+                        />
+
+                        <FormCascader
+                            required={true}
+                            name={["user", "cascader"]}
+                            label={"级联选择"}
                             options={[
                                 {
-                                    key: '1',
-                                    label: '测试1',
-                                    value: '1'
+                                    label: '选项1',
+                                    value: '1',
+                                    children: [
+                                        {
+                                            label: '选项1-1',
+                                            value: '1-1',
+                                            children: [
+                                                {
+                                                    label: '选项1-1-1',
+                                                    value: '1-1-1',
+                                                },
+                                                {
+                                                    label: '选项1-1-2',
+                                                    value: '1-1-2',
+                                                },
+                                            ]
+                                        },
+                                        {
+                                            label: '选项1-2',
+                                            value: '1-2',
+                                        },
+                                    ]
                                 },
                                 {
-                                    key: '2',
-                                    label: '测试2',
-                                    value: '2'
+                                    label: '选项2',
+                                    value: '2',
+                                    children: [
+                                        {
+                                            label: '选项2-1',
+                                            value: '2-1',
+                                        },
+                                        {
+                                            label: '选项2-2',
+                                            value: '2-2',
+                                        },
+                                    ]
                                 },
                             ]}
                         />
-                    </Form.Item>
-                </Form>
 
-                <Space>
-                    <Button
-                        onClick={()=>{
-                            form.submit();
-                        }}
-                    >
-                        submit1
-                    </Button>
+                        <FormSelect
+                            required={true}
+                            name={["user", "select"]}
+                            label={"选择器"}
+                            selectMultiple={true}
+                            options={[
+                                {label: '选项1', value: '1'},
+                                {label: '选项2', value: '2'},
+                                {label: '选项3', value: '3'},
+                            ]}
+                        />
 
-                    <Button
-                        onClick={()=>{
-                            const values = form.getFieldsValue();
-                            console.log(values);
-                        }}
-                    >
-                        submit2
-                    </Button>
-
-                    <Button
-                        onClick={()=>{
-                            form.validateFields().then(res=>{
-                                console.log(res);
-                            }).catch(e=>{
-                                console.log(e);
-                            });
-                        }}
-                    >
-                        submit3
-                    </Button>
+                        <FormUploader
+                            required={true}
+                            name={["user", "avatar"]}
+                            label={"头像"}
+                        />
+
+                        <FormColor
+                            required={true}
+                            name={["user", "color"]}
+                            label={"颜色"}
+                        />
+
+                        <FormCode
+                            required={true}
+                            name={["user", "ideCode"]}
+                            label={"代码"}
+                        />
+                    </Form>
+                </Col>
 
-                    <Button
-                        onClick={()=>{
-                            form.setFieldValue('test', '1,2');
+                <Col span={12}>
+                    <Form
+                        form={rightFormInstance}
+                        footer={(
+                            <FooterButtons
+                                formInstance={rightFormInstance}
+                            />
+                        )}
+                        loadFields={async () => {
+                            return fields;
                         }}
                     >
-                        setFieldValue
-                    </Button>
-                </Space>
-            </div>
-        </Page>
+                    </Form>
+                </Col>
+            </Row>
+
+        </PageContainer>
     );
 }
 
-export default FormTest;
+export default FormPage;
diff --git a/admin-ui/src/pages/jar/index.tsx b/admin-ui/src/pages/jar/index.tsx
deleted file mode 100644
index 28bdf40f..00000000
--- a/admin-ui/src/pages/jar/index.tsx
+++ /dev/null
@@ -1,73 +0,0 @@
-import React from "react";
-import {PageContainer, ProForm, ProFormText} from "@ant-design/pro-components";
-import ProFormUploader from "@/components/Form/ProFormUploader";
-import {restart, upload} from "@/api/jar";
-import {Button, Space} from "antd";
-
-const JarPage = () => {
-
-    const [form] = ProForm.useForm();
-
-    return (
-        <PageContainer>
-
-            <ProForm
-                form={form}
-                initialValues={{
-                    classname: "com.codingapi.jar.controller.HelloController"
-                }}
-                submitter={false}
-                onFinish={async (values) => {
-                    const data = values.content[0].response;
-                    const filename = values.content[0].name;
-                    await upload({
-                        content: data,
-                        filename
-                    });
-                }}
-            >
-                <ProFormText
-                    name={"filename"}
-                    hidden={true}
-                />
-
-                <ProFormText
-                    name={"classname"}
-                    label={"类名"}
-                />
-
-                <ProFormUploader
-                    name={"content"}
-                    label={"Jar包"}
-                />
-
-            </ProForm>
-
-            <Space>
-                <Button
-                    onClick={() => {
-                        form.resetFields();
-                        form.setFieldsValue({
-                            classname: "com.codingapi.jar.controller.HelloController"
-                        });
-                    }}>重置</Button>
-                <Button
-                    type={"primary"}
-                    onClick={() => {
-                        form.submit();
-                    }}>提交</Button>
-                <Button
-                    type={"primary"}
-                    danger={true}
-                    onClick={async () => {
-                        await restart();
-                    }}
-                >重启服务</Button>
-            </Space>
-
-
-        </PageContainer>
-    )
-}
-
-export default JarPage;
diff --git a/admin-ui/src/pages/menu/index.tsx b/admin-ui/src/pages/menu/index.tsx
deleted file mode 100644
index de048baa..00000000
--- a/admin-ui/src/pages/menu/index.tsx
+++ /dev/null
@@ -1,8 +0,0 @@
-import React from "react";
-import Menu from "@/layout/pages/Menu";
-
-const MenuPage = () => {
-    return <Menu/>
-}
-
-export default MenuPage;
diff --git a/admin-pro-ui/src/pages/mirco/index.tsx b/admin-ui/src/pages/mirco/index.tsx
similarity index 100%
rename from admin-pro-ui/src/pages/mirco/index.tsx
rename to admin-ui/src/pages/mirco/index.tsx
diff --git a/admin-ui/src/pages/node/index.tsx b/admin-ui/src/pages/node/index.tsx
deleted file mode 100644
index 5a926a07..00000000
--- a/admin-ui/src/pages/node/index.tsx
+++ /dev/null
@@ -1,231 +0,0 @@
-import {del, list, save} from '@/api/node';
-import {PlusOutlined} from '@ant-design/icons';
-import type {ActionType, ProColumns} from '@ant-design/pro-components';
-import {ModalForm, PageContainer, ProFormSelect, ProFormText, ProTable} from '@ant-design/pro-components';
-import {Button, Form, message, Popconfirm} from 'antd';
-import React, {useRef, useState} from 'react';
-
-const NodePage: React.FC = () => {
-
-    const actionRef = useRef<ActionType>(null);
-    const [form] = Form.useForm();
-    const [createModalOpen, handleModalOpen] = useState<boolean>(false);
-
-    const handleAdd = async (fields: any) => {
-        const hide = message.loading('正在添加');
-        try {
-            await save({...fields});
-            hide();
-            message.success('保存成功');
-            return true;
-        } catch (error) {
-            hide();
-            message.error('保存失败，请重试!');
-            return false;
-        }
-    };
-
-
-    const handleDel = async (id: string) => {
-        const hide = message.loading('正在删除');
-        try {
-            await del({id: id});
-            hide();
-            message.success('删除成功');
-            if (actionRef.current) {
-                actionRef?.current.reload();
-            }
-            return true;
-        } catch (error) {
-            hide();
-            message.error('删除失败，请重试!');
-            return false;
-        }
-    };
-
-    const columns: ProColumns<any>[] = [
-        {
-            title: "编号",
-            dataIndex: 'id',
-            key: 'id',
-            sorter: true,
-            search: false,
-        },
-        {
-            title: "服务名称",
-            dataIndex: 'name',
-            key: 'name',
-            sorter: true,
-        },
-        {
-            title: "地址",
-            dataIndex: 'url',
-            search: false,
-            key: 'url',
-        },
-        {
-            title: "状态",
-            dataIndex: 'state',
-            key: 'state',
-            filters: [
-                {
-                    text: '禁用',
-                    value: 0,
-                },
-                {
-                    text: '启用',
-                    value: 1,
-                },
-            ],
-            valueEnum: {
-                0: {
-                    text: '禁用',
-                    status: 'Error'
-                },
-                1: {
-                    text: '启用',
-                    status: 'Success'
-                },
-            },
-        },
-        {
-            title: "操作",
-            dataIndex: 'option',
-            valueType: 'option',
-            key: 'option',
-            render: (_, record) => [
-                <a
-                    key="config"
-                    onClick={() => {
-                        form.setFieldsValue(record)
-                        handleModalOpen(true);
-                    }}
-                >
-                    修改
-                </a>,
-                <Popconfirm
-                    key="delete"
-                    title="删除提示"
-                    description="确认要删除这条数据吗?"
-                    onConfirm={async () => {
-                        await handleDel(record.id);
-                    }}
-                    okText="确认"
-                    cancelText="取消"
-                >
-                    <a key="delete">
-                        删除
-                    </a>
-                </Popconfirm>
-            ],
-        },
-    ];
-
-    return (
-        <PageContainer>
-            <ProTable
-                headerTitle="服务节点配置"
-                actionRef={actionRef}
-                columns={columns}
-                rowKey="id"
-
-                toolBarRender={() => [
-                    <Button
-                        type="primary"
-                        key="primary"
-                        onClick={() => {
-                            handleModalOpen(true);
-                        }}
-                    >
-                        <PlusOutlined/> 新建
-                    </Button>
-                ]}
-                request={async (params, sort, filter) => {
-                    return await list(params, sort, filter, [
-                        {
-                            key: 'name',
-                            type: 'LIKE'
-                        }
-                    ]);
-                }
-                }
-            />
-
-            <ModalForm
-                title="新建规则"
-                form={form}
-                initialValues={{
-                    state: 1,
-                }}
-                modalProps={{
-                    destroyOnClose: true,
-                    onCancel: () => {
-                        form.resetFields();
-                    },
-                }}
-                open={createModalOpen}
-                onOpenChange={handleModalOpen}
-                onFinish={async (value) => {
-                    const success = await handleAdd(value);
-                    if (success) {
-                        handleModalOpen(false);
-                        if (actionRef.current) {
-                            actionRef?.current.reload();
-                        }
-                    }
-                }}
-            >
-                <ProFormText
-                    hidden={true}
-                    name="id"
-                />
-                <ProFormText
-                    label="服务名称"
-                    placeholder="请输入服务名称"
-                    rules={[
-                        {
-                            required: true,
-                            message: "请输入服务名称",
-                        },
-                    ]}
-                    name="name"
-                />
-                <ProFormText
-                    label="服务地址"
-                    rules={[
-                        {
-                            required: true,
-                            message: "请输入服务名称",
-                        },
-                    ]}
-                    placeholder="请输入服务地址"
-                    name="url"/>
-
-                <ProFormSelect
-                    label="服务状态"
-                    placeholder="请输入服务状态"
-                    rules={[
-                        {
-                            required: true,
-                            message: "请输入服务状态",
-                        },
-                    ]}
-                    options={[
-                        {
-                            label: '启用',
-                            value: 1,
-                        },
-                        {
-                            label: '禁用',
-                            value: 0,
-                        },
-                    ]}
-                    name="state"
-                />
-            </ModalForm>
-
-        </PageContainer>
-    );
-};
-
-export default NodePage;
diff --git a/admin-ui/src/pages/portal/Draggable.tsx b/admin-ui/src/pages/portal/Draggable.tsx
deleted file mode 100644
index 4940a268..00000000
--- a/admin-ui/src/pages/portal/Draggable.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import React from 'react';
-import {useDraggable} from '@dnd-kit/core';
-
-const Draggable = (props: any) => {
-    const {attributes, listeners, setNodeRef, transform} = useDraggable({
-        id: 'draggable',
-    });
-    const style = transform ? {
-        transform: `translate3d(${transform.x}px, ${transform.y}px, 0)`,
-    } : undefined;
-
-
-    return (
-        <div ref={setNodeRef} style={style} {...listeners} {...attributes}>
-            {props.children}
-        </div>
-    );
-}
-
-export default Draggable;
diff --git a/admin-ui/src/pages/portal/Droppable.tsx b/admin-ui/src/pages/portal/Droppable.tsx
deleted file mode 100644
index 19cf9063..00000000
--- a/admin-ui/src/pages/portal/Droppable.tsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import React from 'react';
-import {useDroppable} from '@dnd-kit/core';
-
-const Droppable=(props:any)=> {
-    const {isOver, setNodeRef} = useDroppable({
-        id: 'droppable',
-    });
-    const style = {
-        color: isOver ? 'green' : undefined,
-    };
-
-
-    return (
-        <div ref={setNodeRef} style={style}>
-            {props.children}
-        </div>
-    );
-}
-
-export default Droppable;
diff --git a/admin-ui/src/pages/portal/index.tsx b/admin-ui/src/pages/portal/index.tsx
deleted file mode 100644
index 09181f07..00000000
--- a/admin-ui/src/pages/portal/index.tsx
+++ /dev/null
@@ -1,11 +0,0 @@
-import React from "react";
-
-const Portal = ()=>{
-    return (
-        <>
-
-        </>
-    )
-}
-
-export default Portal;
diff --git a/admin-ui/src/pages/redux/test1.tsx b/admin-ui/src/pages/redux/test1.tsx
deleted file mode 100644
index c75547b3..00000000
--- a/admin-ui/src/pages/redux/test1.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import React from 'react';
-import {useDispatch, useSelector} from 'react-redux';
-import {decrement, increment} from '@/store/CounterSlice';
-import {RootState} from "@/store/Redux";
-import {Button, Space} from "antd";
-import {PageContainer} from "@ant-design/pro-components";
-
-const Test1 = () => {
-    const counter = useSelector((state: RootState) => state.counter.value);
-    const dispatch = useDispatch();
-    return (
-        <PageContainer>
-            <div style={{
-                display: 'flex',
-                flexDirection: 'column',
-                justifyContent: 'center',
-                alignItems: 'center',
-            }}>
-                <div style={{
-                    textAlign: 'center',
-                    marginBottom: 20,
-                }}>
-                    <h1>Counter: {counter}</h1>
-                </div>
-
-                <Space>
-                    <Button onClick={() => dispatch(increment())}>Increment</Button>
-                    <Button onClick={() => dispatch(decrement())}>Decrement</Button>
-                </Space>
-            </div>
-        </PageContainer>
-    );
-}
-
-export default Test1;
diff --git a/admin-ui/src/pages/redux/test2.tsx b/admin-ui/src/pages/redux/test2.tsx
deleted file mode 100644
index 00bbbe47..00000000
--- a/admin-ui/src/pages/redux/test2.tsx
+++ /dev/null
@@ -1,37 +0,0 @@
-import React from 'react';
-import {useDispatch, useSelector} from 'react-redux';
-import {decrement, increment} from '@/store/CounterSlice';
-import {RootState} from "@/store/Redux";
-import {Button, Space} from "antd";
-import {PageContainer} from "@ant-design/pro-components";
-
-const Test2 = () => {
-    const counter = useSelector((state: RootState) => state.counter.value);
-    const dispatch = useDispatch();
-
-    return (
-        <PageContainer>
-            <div style={{
-                display: 'flex',
-                flexDirection: 'column',
-                justifyContent: 'center',
-                alignItems: 'center',
-            }}>
-                <div style={{
-                    textAlign: 'center',
-                    marginBottom: 20,
-                }}>
-                    <h1>Counter: {counter}</h1>
-
-                </div>
-
-                <Space>
-                    <Button onClick={() => dispatch(increment())}>Increment</Button>
-                    <Button onClick={() => dispatch(decrement())}>Decrement</Button>
-                </Space>
-            </div>
-        </PageContainer>
-    );
-}
-
-export default Test2;
diff --git a/admin-ui/src/pages/role/index.tsx b/admin-ui/src/pages/role/index.tsx
deleted file mode 100644
index 37992ef3..00000000
--- a/admin-ui/src/pages/role/index.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import React from "react";
-import {Button} from "antd";
-import Page from "@/components/Layout/Page";
-
-
-const Role = () => {
-
-    return (
-        <Page enablePageContainer>
-            <h3 role-key={"title"}>AccessProvider Test Page</h3>
-
-            <div role-key={"roles"}>
-                <Button type="primary">Admin Button</Button>
-            </div>
-        </Page>
-    )
-}
-
-export default Role;
\ No newline at end of file
diff --git a/admin-ui/src/pages/salary/compoments/AGTable.tsx b/admin-ui/src/pages/salary/compoments/AGTable.tsx
deleted file mode 100644
index 5a7da887..00000000
--- a/admin-ui/src/pages/salary/compoments/AGTable.tsx
+++ /dev/null
@@ -1,107 +0,0 @@
-import {AgGridReact} from 'ag-grid-react';
-import {AllCommunityModule, ModuleRegistry, themeQuartz,} from "ag-grid-community";
-import {AG_GRID_LOCALE_CN} from '@ag-grid-community/locale';
-import {useCallback, useMemo, useState} from "react";
-
-const localeText = AG_GRID_LOCALE_CN;
-// Register all Community features
-ModuleRegistry.registerModules([AllCommunityModule]);
-
-
-const myTheme = themeQuartz.withParams({
-    /* Low spacing = very compact */
-    spacing: 2,
-    accentColor: "red",
-
-});
-const AGTable = () => {
-    const [rowData, setRowData] = useState();
-    const [columnDefs, setColumnDefs] = useState([
-        {
-            field: "athlete",
-            headerName: "运动员"
-        },
-        {
-            field: "age",
-            headerName: "年龄"
-        },
-        {
-            field: "country",
-            headerName: '国家信息',
-            headerClass: 'country-header',
-            children: [
-                {
-                    field: "country",
-                    headerName: "国家",
-                },
-                {field: "name"},
-                {field: "code"}
-            ]
-        },
-        {field: "year", headerName: "年份"},
-        {field: "date", headerName: "日期"},
-        {field: "sport", headerName: "运动"},
-        {field: "gold", headerName: "金牌"},
-        {field: "silver", headerName: "银牌"},
-        {field: "bronze", headerName: "铜牌"},
-        {field: "total", headerName: "总计", editable: false},
-    ]);
-    const theme = useMemo(() => {
-        return myTheme;
-    }, []);
-    const defaultColDef = useMemo(() => {
-        return {
-            editable: true,
-            filter: true,
-        };
-    }, []);
-
-    const onGridReady = useCallback((params: any) => {
-        fetch("https://www.ag-grid.com/example-assets/olympic-winners.json")
-            .then((resp) => resp.json())
-            .then((data) => setRowData(data));
-    }, []);
-
-
-    const onChange = (row:any,updateRow:(row:any)=>void,refreshColumns:()=>void)=>{
-        const gold = row.gold;
-        const silver = row.silver;
-        const bronze = row.bronze;
-        const total = gold + silver + bronze;
-
-        updateRow({...row,total});
-
-        // update redux store message
-
-        refreshColumns()
-    }
-
-    return (
-        <div
-            // define a height because the Data Grid will fill the size of the parent container
-            style={{height: 900}}
-        >
-            <AgGridReact
-                rowData={rowData}
-                localeText={localeText}
-                onCellValueChanged={(event) => {
-                    //@ts-ignore
-                    if (['gold', 'silver', 'bronze'].includes(event.colDef.field)) {
-                        onChange( event.data,(data:any)=>{
-                            event.data.total = data.total;
-                        },()=>{
-                            event.api.refreshCells({columns: ['total']});
-                        });
-                    }
-                }}
-                columnDefs={columnDefs}
-                theme={theme}
-                // pagination={true}
-                defaultColDef={defaultColDef}
-                onGridReady={onGridReady}
-            />
-        </div>
-    );
-}
-
-export default AGTable;
diff --git a/admin-ui/src/pages/salary/compoments/SalaryTable1.tsx b/admin-ui/src/pages/salary/compoments/SalaryTable1.tsx
deleted file mode 100644
index 16f04951..00000000
--- a/admin-ui/src/pages/salary/compoments/SalaryTable1.tsx
+++ /dev/null
@@ -1,112 +0,0 @@
-import React, {useEffect} from "react";
-import {ActionType, EditableProTable, ProTable} from "@ant-design/pro-components";
-import {useDispatch, useSelector} from "react-redux";
-import {SalaryState, updateTable1} from "@/pages/salary/store/salary";
-import {Table1UpdateService} from "@/pages/salary/data/table1";
-import {ProColumns} from "@ant-design/pro-table/es/typing";
-import {Input, InputNumber, Space} from "antd";
-import AGTable from "@/pages/salary/compoments/AGTable";
-
-const SalaryTable1 = () => {
-
-    const users = useSelector((state: SalaryState) => state.salary.users);
-
-    const table1 = useSelector((state: SalaryState) => state.salary.table1);
-
-    const store = useSelector((state: SalaryState) => state.salary);
-
-    const table2 = useSelector((state: SalaryState) => state.salary.table2);
-
-    const table2Version = useSelector((state: SalaryState) => state.salary.table2Version);
-
-    const actionRef = React.useRef<ActionType>(null);
-
-    const dispatch = useDispatch();
-
-    const table1UpdateService = new Table1UpdateService(store,
-        (data) => {
-            dispatch(updateTable1(data));
-        }, () => {
-            actionRef.current?.reload();
-        });
-
-    useEffect(() => {
-        table1UpdateService.initData(users);
-    }, [users]);
-
-    // useEffect(() => {
-    //     table1UpdateService.reloadData(table2);
-    // }, [table2Version]);
-
-    const columns = [
-        {
-            title: 'id',
-            dataIndex: 'id',
-            valueType: 'text',
-            editable: false,
-        },
-        {
-            title: '姓名',
-            dataIndex: 'name',
-            valueType: 'text',
-            editable: false,
-            render: (text, record) => {
-                return <InputNumber
-                    value={record.name}
-                    defaultValue={record.name}/>
-            }
-        },
-        {
-            title: '绩效工资',
-            dataIndex: 'jxgz',
-            valueType: 'digit',
-            editable: false,
-            render: (text, record) => {
-                return <InputNumber
-                    value={record.jxgz}
-                    defaultValue={record.jxgz}/>
-            }
-        },
-        {
-            title: '小计',
-            dataIndex: 'sum',
-            valueType: 'text',
-            editable: false,
-            render: (text, record) => {
-                return <InputNumber
-                    value={record.sum}
-                    defaultValue={record.sum}/>
-            }
-        }
-    ] as ProColumns[];
-
-    return (
-        <>
-            {/*<ProTable*/}
-            {/*    actionRef={actionRef}*/}
-            {/*    columns={columns}*/}
-            {/*    search={false}*/}
-            {/*    rowKey={"id"}*/}
-            {/*    virtual={true}*/}
-            {/*    pagination={{*/}
-            {/*        pageSize: 20*/}
-            {/*    }}*/}
-            {/*    scroll={{*/}
-            {/*        x:2900,*/}
-            {/*        y:800*/}
-            {/*    }}*/}
-            {/*    request={async () => {*/}
-            {/*        return {*/}
-            {/*            // table1 top 100*/}
-            {/*            data: table1,*/}
-            {/*            success: true*/}
-            {/*        }*/}
-            {/*    }}*/}
-            {/*/>*/}
-
-            <AGTable/>
-        </>
-    )
-}
-
-export default SalaryTable1;
diff --git a/admin-ui/src/pages/salary/compoments/SalaryTable2.tsx b/admin-ui/src/pages/salary/compoments/SalaryTable2.tsx
deleted file mode 100644
index 6b6342e5..00000000
--- a/admin-ui/src/pages/salary/compoments/SalaryTable2.tsx
+++ /dev/null
@@ -1,159 +0,0 @@
-import React, {useEffect} from "react";
-import {ActionType, EditableProTable, ProTable} from "@ant-design/pro-components";
-import {SalaryState, updateTable2, updateTable2Version} from "@/pages/salary/store/salary";
-import {useDispatch, useSelector} from "react-redux";
-import {Table2UpdateService} from "@/pages/salary/data/table2";
-import {Input, InputNumber} from "antd";
-import {ProColumns} from "@ant-design/pro-table/es/typing";
-import AGTable from "@/pages/salary/compoments/AGTable";
-
-const SalaryTable2 = () => {
-
-    const users = useSelector((state: SalaryState) => state.salary.users);
-
-    const table2 = useSelector((state: SalaryState) => state.salary.table1);
-
-    const actionRef = React.useRef<ActionType>(null);
-
-    const dispatch = useDispatch();
-
-    // const table2UpdateService = new Table2UpdateService(table2,
-    //     (data) => {
-    //         dispatch(updateTable2(data));
-    //     }, () => {
-    //         actionRef.current?.reload();
-    //     },(version)=>{
-    //         dispatch(updateTable2Version(version));
-    //     });
-
-    // useEffect(() => {
-    //     table2UpdateService.initData(users);
-    // }, [users]);
-
-
-
-
-    const columns = [
-        {
-            title: 'id',
-            dataIndex: 'id',
-            valueType: 'text',
-            editable: false,
-        },
-        {
-            title: '姓名',
-            dataIndex: 'name',
-            valueType: 'text',
-            editable: true,
-            // render: (text, record) => {
-            //     return <Input defaultValue={record.name}/>
-            // }
-        },
-        {
-            title: '科目1',
-            dataIndex: 'kemu1',
-            valueType: 'digit',
-            editable: true,
-            // render: (text, record) => {
-            //     return <InputNumber
-            //         defaultValue={record.kemu1}
-            //         value={record.kemu1}
-            //         onBlur={(e)=>{
-            //             const data = {
-            //                 ...record,
-            //                 kemu1: parseFloat(e.target.value)
-            //             }
-            //             table2UpdateService.onChange(data);
-            //         }}
-            //     />
-            // }
-        },
-        {
-            title: '科目2',
-            dataIndex: 'kemu2',
-            valueType: 'digit',
-            editable: true,
-            // render: (text, record) => {
-            //     return <InputNumber
-            //         defaultValue={record.kemu2}
-            //         value={record.kemu2}
-            //         onBlur={(e)=>{
-            //             const data = {
-            //                 ...record,
-            //                 kemu2: parseFloat(e.target.value )
-            //             }
-            //             console.log(data)
-            //             table2UpdateService.onChange(data);
-            //         }}
-            //     />
-            // }
-        },
-        {
-            title: '小计',
-            dataIndex: 'sum',
-            valueType: 'text',
-            editable: true,
-            // render: (text, record) => {
-            //     return <InputNumber
-            //         defaultValue={record.sum}
-            //         value={record.sum}
-            //     />
-            // }
-        }
-    ]  as ProColumns[];
-
-
-    for(let i=0;i<30;i++){
-        columns.push(
-            {
-                title: '科目21'+i,
-                dataIndex: 'kemu2'+i,
-                //@ts-ignore
-                valueType: 'digit'+i,
-                // render: (text, record) => {
-                //     return <InputNumber
-                //         defaultValue={record.kemu2}
-                //         value={record.kemu2}
-                //         onBlur={(e)=>{
-                //             const data = {
-                //                 ...record,
-                //                 kemu2: parseFloat(e.target.value )
-                //             }
-                //             console.log(data)
-                //             table2UpdateService.onChange(data);
-                //         }}
-                //     />
-                // }
-            },
-        )
-    }
-
-    return (
-        <>
-            {/*<ProTable*/}
-            {/*    actionRef={actionRef}*/}
-            {/*    columns={columns}*/}
-            {/*    rowKey={"id"}*/}
-            {/*    search={false}*/}
-            {/*    virtual={true}*/}
-            {/*    pagination={{*/}
-            {/*        pageSize: 20*/}
-            {/*    }}*/}
-            {/*    scroll={{*/}
-            {/*        x:5000,*/}
-            {/*        y:800*/}
-            {/*    }}*/}
-            {/*    request={async () => {*/}
-            {/*        console.log('reload table2')*/}
-            {/*        return {*/}
-            {/*            data: table2,*/}
-            {/*            success: true*/}
-            {/*        }*/}
-            {/*    }}*/}
-            {/*/>*/}
-            <AGTable/>
-        </>
-    )
-}
-
-export default SalaryTable2;
diff --git a/admin-ui/src/pages/salary/data/table1.ts b/admin-ui/src/pages/salary/data/table1.ts
deleted file mode 100644
index cbfc2ee7..00000000
--- a/admin-ui/src/pages/salary/data/table1.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-import {Table1, Table2, User} from "@/pages/salary/types";
-import {SalaryStore} from "@/pages/salary/store/salary";
-
-export class Table1UpdateService {
-
-    private readonly data: Table1[];
-    private readonly update: (data: Table1[]) => void;
-    private readonly reload: () => void;
-
-
-    constructor(store: SalaryStore, update: (data: Table1[]) => void, reload: () => void) {
-        this.data = store.table1;
-        this.update = update;
-        this.reload = reload;
-
-    }
-
-
-    public initData(users: User[]) {
-        const t1 = new Date().getTime();
-        const data = users.map((user) => {
-            return {
-                id: user.id,
-                name: user.name,
-                jxgz: 0,
-                sum: 0
-            }
-        });
-        this.updateData(data);
-        const t2 = new Date().getTime();
-        console.log("initData", t2 - t1);
-    }
-
-
-    public reloadData(table2: Table2[]) {
-        const list = this.data.map((item) => {
-            const row = table2.find((row) => row.id === item.id);
-            if (row) {
-                if (item.id === row.id) {
-                    return {
-                        ...item,
-                        jxgz: row.sum,
-                        sum: row.sum
-                    }
-                }
-            }
-            return item;
-        });
-        this.updateData(list);
-    }
-
-
-    private updateData(data: Table1[]) {
-        this.update(data);
-        this.reload();
-    }
-
-}
diff --git a/admin-ui/src/pages/salary/data/table2.ts b/admin-ui/src/pages/salary/data/table2.ts
deleted file mode 100644
index 2bf91c12..00000000
--- a/admin-ui/src/pages/salary/data/table2.ts
+++ /dev/null
@@ -1,57 +0,0 @@
-import {Table2, User} from "@/pages/salary/types";
-
-export class Table2UpdateService {
-
-    private data: Table2[];
-    private readonly update: (data: Table2[]) => void;
-    private readonly reload: () => void;
-    private readonly updateVersion: (version: number) => void;
-
-    constructor(table2: Table2[], update: (data: Table2[]) => void, reload: () => void, updateVersion: (version: number) => void) {
-        this.data = table2;
-        this.update = update;
-        this.reload = reload;
-        this.updateVersion = updateVersion;
-    }
-
-
-    public initData(users: User[]) {
-        const data = users.map((user) => {
-            return {
-                id: user.id,
-                name: user.name,
-                kemu1: 0,
-                kemu2: 0,
-                sum: 0
-            }
-        });
-        this.updateData(data);
-    }
-
-
-    public onChange(row: Table2) {
-        const t1 = new Date().getMilliseconds();
-        const sum = row.kemu1 + row.kemu2;
-        const list = this.data.map((item) => {
-            if (item.id === row.id) {
-                return {
-                    ...item,
-                    ...row,
-                    sum
-                }
-            }
-            return item;
-        });
-        console.log(sum);
-        this.updateData(list);
-        const t2 = new Date().getMilliseconds();
-        console.log("onChange", t2 - t1);
-    }
-
-
-    private updateData(data: Table2[]) {
-        this.update(data);
-        this.reload();
-        this.updateVersion(Math.random());
-    }
-}
diff --git a/admin-ui/src/pages/salary/index.tsx b/admin-ui/src/pages/salary/index.tsx
deleted file mode 100644
index b17754d2..00000000
--- a/admin-ui/src/pages/salary/index.tsx
+++ /dev/null
@@ -1,82 +0,0 @@
-import React, {useEffect, useState} from "react";
-import {Provider, useDispatch} from "react-redux";
-import {salaryStore, updateUsers} from "@/pages/salary/store/salary";
-import {PageContainer} from "@ant-design/pro-components";
-import {Tabs} from "antd";
-import SalaryTable1 from "@/pages/salary/compoments/SalaryTable1";
-import SalaryTable2 from "@/pages/salary/compoments/SalaryTable2";
-import {users} from "@/api/salary";
-
-
-const $Salary = () => {
-
-    const items = [
-        {
-            key: "1",
-            label: "总科目",
-            children: <SalaryTable1/>
-        },
-    ];
-
-    for (let i = 2; i < 500; i++) {
-        items.push(
-            {
-                key: i + '',
-                label: "绩效工资",
-                children: (
-                    <SalaryTable2/>
-                )
-            })
-    }
-
-    const [activeKey, setActiveKey] = useState("1");
-
-    const dispatch = useDispatch();
-
-    useEffect(() => {
-        users().then(res => {
-            dispatch(updateUsers(res));
-        })
-    }, []);
-
-    return (
-        <PageContainer>
-            <Tabs
-                activeKey={activeKey}
-                onChange={(value) => {
-                    setActiveKey(value);
-                }}
-            >
-                {items.map(item => {
-                    return (
-                        <Tabs.TabPane
-                            key={item.key}
-                            tab={item.label}
-                        />
-                    )
-                })}
-            </Tabs>
-
-            {items.map(item => {
-                if (item.key === activeKey) {
-                    return item.children;
-                }
-            })}
-
-
-        </PageContainer>
-    )
-}
-
-const Salary = () => {
-    return (
-        <>
-            <Provider store={salaryStore}>
-                <$Salary/>
-            </Provider>
-        </>
-    )
-}
-
-
-export default Salary;
diff --git a/admin-ui/src/pages/salary/store/salary.ts b/admin-ui/src/pages/salary/store/salary.ts
deleted file mode 100644
index ddd54a23..00000000
--- a/admin-ui/src/pages/salary/store/salary.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-import {configureStore, createSlice, PayloadAction} from '@reduxjs/toolkit';
-import {Table1, Table2, User} from "@/pages/salary/types";
-
-export interface SalaryStore {
-    users: User[];
-    table1: Table1[];
-    table2: Table2[];
-    table2Version:number;
-}
-
-export type SalaryStoreAction = {
-
-    updateUsers: (state: SalaryStore, action: PayloadAction<User[]>) => void;
-
-    updateTable1: (state: SalaryStore, action: PayloadAction<Table1[]>) => void;
-
-    updateTable2: (state: SalaryStore, action: PayloadAction<Table2[]>) => void;
-
-    updateTable2Version: (state: SalaryStore, action: PayloadAction<number>) => void;
-}
-
-export const SalarySlice = createSlice<SalaryStore, SalaryStoreAction, "salary", {}>({
-    name: 'salary',
-    initialState: {
-        users: [],
-        table1: [],
-        table2: [],
-        table2Version:0
-    },
-    reducers: {
-
-        updateUsers: (state, action) => {
-            state.users = action.payload;
-        },
-
-        updateTable1: (state, action) => {
-            state.table1 = action.payload;
-        },
-
-        updateTable2: (state, action) => {
-            state.table2 = action.payload;
-        },
-
-        updateTable2Version: (state, action) => {
-            state.table2Version = action.payload;
-        }
-
-    },
-});
-
-export const {
-    updateUsers,
-    updateTable1,
-    updateTable2,
-    updateTable2Version
-} = SalarySlice.actions;
-
-export const salaryStore = configureStore({
-    reducer: {
-        salary: SalarySlice.reducer
-    },
-});
-
-export type SalaryState = ReturnType<typeof salaryStore.getState>;
diff --git a/admin-ui/src/pages/salary/types.ts b/admin-ui/src/pages/salary/types.ts
deleted file mode 100644
index d4fd1ad4..00000000
--- a/admin-ui/src/pages/salary/types.ts
+++ /dev/null
@@ -1,22 +0,0 @@
-
-export interface User{
-    id:number,
-    name:string
-}
-
-
-export interface Table1{
-    id:number,
-    name:string,
-    jxgz:number,
-    sum:number
-}
-
-
-export interface Table2{
-    id:number,
-    name:string,
-    kemu1:number,
-    kemu2:number,
-    sum:number
-}
diff --git a/admin-ui/src/pages/user/index.tsx b/admin-ui/src/pages/user/index.tsx
deleted file mode 100644
index a7533db5..00000000
--- a/admin-ui/src/pages/user/index.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import {list} from '@/api/user';
-import type {ActionType} from '@ant-design/pro-components';
-import {PageContainer, ProTable} from '@ant-design/pro-components';
-import React, {useRef} from 'react';
-
-const UserPage: React.FC = () => {
-
-    const actionRef = useRef<ActionType>(null);
-
-    const columns = [
-        {
-            title: "编号",
-            dataIndex: 'id',
-            key: 'id',
-            sorter: true,
-            search: false,
-        },
-        {
-            title: "名称",
-            dataIndex: 'name',
-            key: 'name',
-        },
-    ];
-
-    return (
-        <PageContainer>
-            <ProTable
-                headerTitle="用户列表"
-                actionRef={actionRef}
-                columns={columns}
-                rowKey="id"
-                request={async (params, sort, filter) => {
-                    return await list(params, sort, filter, [
-                        {
-                            key: 'name',
-                            type: 'LIKE'
-                        }
-                    ]);
-                }}
-            />
-        </PageContainer>
-    );
-};
-
-export default UserPage;
diff --git a/admin-ui/src/pages/welcome/__test__/index.test.tsx b/admin-ui/src/pages/welcome/__test__/index.test.tsx
deleted file mode 100644
index 4fbc8f3d..00000000
--- a/admin-ui/src/pages/welcome/__test__/index.test.tsx
+++ /dev/null
@@ -1,33 +0,0 @@
-import React from 'react';
-import Welcome from '../index';
-import {render} from "@testing-library/react";
-import store from "@/store/Redux";
-import {Provider} from "react-redux";
-import {Calculate} from "../data";
-
-// test description for the component
-describe('Welcome Component', () => {
-    // test case for the component
-    test('renders with default initial value', () => {
-        // render the component
-        render(
-            <Provider store={store}>
-                <Welcome />
-            </Provider>
-        );
-        // get the element that will be tested
-        const countElement = document.querySelector('.App-header p');
-        // assert the element is exist
-        expect(countElement).toBeInTheDocument();
-        // assert the element text content
-        expect(countElement).toHaveTextContent('hi , Redux counter: 0, Roles:');
-        // log the element text content
-        console.log(countElement?.textContent);
-    });
-
-
-    test('method add test', () => {
-        const sum = Calculate.add(1,1);
-        expect(sum).toBe(2);
-    });
-});
diff --git a/admin-ui/src/pages/welcome/data.ts b/admin-ui/src/pages/welcome/data.ts
deleted file mode 100644
index 8128121b..00000000
--- a/admin-ui/src/pages/welcome/data.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-export class Calculate{
-
-    static add = (a: number, b: number) => {
-        return a + b;
-    }
-
-    static sub = (a: number, b: number) => {
-        return a - b;
-    }
-
-    static mul = (a: number, b: number) => {
-        return a * b;
-    }
-
-    static div = (a: number, b: number) => {
-        return a / b;
-    }
-}
diff --git a/admin-ui/src/pages/welcome/index.tsx b/admin-ui/src/pages/welcome/index.tsx
index 80579a34..5bf4fca0 100644
--- a/admin-ui/src/pages/welcome/index.tsx
+++ b/admin-ui/src/pages/welcome/index.tsx
@@ -1,61 +1,21 @@
 import React from 'react';
+import {PageContainer} from "@ant-design/pro-components";
 import './index.scss';
-import Page from "@/components/Layout/Page";
-import {Button, Form, Input} from "antd";
-import {FlowFormApiContext, FlowFormCustomValidateContext} from "@/api/validate";
-import * as api from "@/api"
 
-FlowFormApiContext.getInstance().setApi({
-    get: (url: string, params?: any) => {
-        return api.get(url, params);
-    },
-    post: (url: string, data: any) => {
-        return api.post(url, data);
-    }
-});
 
-const Index = () => {
-
-    const [form] = Form.useForm();
-
-    const context = new FlowFormCustomValidateContext();
-
-    const validateFuncCode = `
-         if (content.value) {
-            return [];
-         } else {
-            return ["姓名不存在"];
-        }
-    `;
-    context.addCustomFunctionCodeValidate(["user", "name"], validateFuncCode);
+const WelcomePage = () => {
 
     return (
-        <Page enablePageContainer={true}>
-
-            <Form
-                form={form}
-            >
-
-                <Form.Item
-                    name={["user", "name"]}
-                    label={"姓名"}
-                >
-                    <Input/>
-                </Form.Item>
-            </Form>
-
-            <Button onClick={() => {
-                form.validateFields().then(res => {
-                    console.log(res);
-                })
-            }}>test1</Button>
-
-            <Button onClick={() => {
-                context.validate(form);
-            }}>test2</Button>
-
-        </Page>
+        <PageContainer>
+
+            <ul>Admin-UI 支持的功能有</ul>
+            <ul>1. 自定义流程</ul>
+            <ul>2. 表单渲染</ul>
+            <ul>3. 管理权限</ul>
+            <ul>4. 动态菜单</ul>
+            <ul>5. 动态加载组件</ul>
+        </PageContainer>
     );
 }
 
-export default Index;
+export default WelcomePage;
diff --git a/admin-ui/src/portal/index.tsx b/admin-ui/src/portal/index.tsx
deleted file mode 100644
index 4e063986..00000000
--- a/admin-ui/src/portal/index.tsx
+++ /dev/null
@@ -1,10 +0,0 @@
-import React from "react";
-
-const Portal = ()=>{
-    return (
-        <>
-
-        </>
-    )
-}
-export default Portal;
diff --git a/admin-pro-ui/src/utils/captcha.ts b/admin-ui/src/utils/captcha.ts
similarity index 100%
rename from admin-pro-ui/src/utils/captcha.ts
rename to admin-ui/src/utils/captcha.ts
diff --git a/admin-pro-ui/src/utils/oss.ts b/admin-ui/src/utils/oss.ts
similarity index 100%
rename from admin-pro-ui/src/utils/oss.ts
rename to admin-ui/src/utils/oss.ts
diff --git a/admin-pro-ui/todo.md b/admin-ui/todo.md
similarity index 100%
rename from admin-pro-ui/todo.md
rename to admin-ui/todo.md
diff --git a/admin-ui/webpack.config.dev.js b/admin-ui/webpack.config.dev.js
index 60b77fdb..2ac3919e 100644
--- a/admin-ui/webpack.config.dev.js
+++ b/admin-ui/webpack.config.dev.js
@@ -4,7 +4,7 @@ const common = require('./webpack.common.js');
 module.exports = merge(common, {
     mode: 'development',
     devServer: {
-        port: 3000,
+        port: 8000,
 
         proxy: [
             {
diff --git a/admin-ui/webpack.config.mock.js b/admin-ui/webpack.config.mock.js
index d53c66ae..1998dc09 100644
--- a/admin-ui/webpack.config.mock.js
+++ b/admin-ui/webpack.config.mock.js
@@ -7,7 +7,7 @@ const express = require('express');
 module.exports = merge(common, {
     mode: 'development',
     devServer: {
-        port: 3000,
+        port: 8000,
 
         setupMiddlewares: (middlewares, devServer) => {
             if (!devServer) {
diff --git a/admin-ui/webpack.config.prod.js b/admin-ui/webpack.config.prod.js
index 90868278..3e2d47c5 100644
--- a/admin-ui/webpack.config.prod.js
+++ b/admin-ui/webpack.config.prod.js
@@ -4,6 +4,6 @@ const common = require('./webpack.common.js');
 module.exports = merge(common,{
     mode: 'production',
     devServer: {
-        port: 13000,
+        port: 8000,
     },
 });
diff --git a/mobile-ui/package.json b/mobile-ui/package.json
index eea4365b..f9f0b19b 100644
--- a/mobile-ui/package.json
+++ b/mobile-ui/package.json
@@ -4,6 +4,9 @@
   "private": true,
   "dependencies": {
     "@babel/standalone": "^7.25.6",
+    "@codingapi/flow-mobile": "^0.0.2",
+    "@codingapi/form-mobile": "^0.0.2",
+    "@codingapi/ui-framework": "^0.0.12",
     "@logicflow/core": "^2.0.10",
     "@logicflow/extension": "^2.0.14",
     "@reduxjs/toolkit": "^2.2.7",
diff --git a/mobile-ui/src/components/descriptions/index.scss b/mobile-ui/src/components/descriptions/index.scss
deleted file mode 100644
index bd0d0289..00000000
--- a/mobile-ui/src/components/descriptions/index.scss
+++ /dev/null
@@ -1,34 +0,0 @@
-@use "@/config/variables" as *;
-
-.descriptions-list {
-  padding: 3px;
-  background-color: white;
-
-  .descriptions-list-item {
-    background-color: white;
-    padding: 15px;
-    font-size: $content-font-size;
-    display: flex;
-    align-items: center;
-    justify-content: space-between;
-    border-bottom: 1px solid $body-background-color;
-
-    .descriptions-list-item-label {
-      font-weight: bold;
-    }
-
-    .descriptions-list-item-value {
-    }
-  }
-
-  .form-header-title {
-    width: 100%;
-    height: 20px;
-    border-left: 4px solid $theme-primary-color;
-    padding-left: 4px;
-    font-size: 14px;
-    margin-bottom: 10px;
-  }
-}
-
-
diff --git a/mobile-ui/src/components/descriptions/index.tsx b/mobile-ui/src/components/descriptions/index.tsx
deleted file mode 100644
index cdb95701..00000000
--- a/mobile-ui/src/components/descriptions/index.tsx
+++ /dev/null
@@ -1,98 +0,0 @@
-import React, {useEffect, useImperativeHandle} from "react";
-import {FormField} from "@/components/form/types";
-import "./index.scss";
-
-export interface DescriptionsAction {
-    // 重新刷新数据
-    reload: () => void;
-}
-
-// 详情展示属性
-interface DescriptionsProps {
-    // 展示的字段
-    columns?: FormField[];
-    // 请求数据
-    request?: () => Promise<any>;
-    // 操作对象
-    actionRef?: React.Ref<DescriptionsAction>;
-    // 页脚
-    footer?: React.ReactNode;
-    // 页头
-    header?: React.ReactNode;
-    // 数据转换
-    dataConvert?: (field: FormField, data: any) => Promise<any>;
-}
-
-// 详情展示
-const Descriptions: React.FC<DescriptionsProps> = (props) => {
-
-    const [data, setData] = React.useState<any>(null);
-
-    const reload = () => {
-        if (props.request) {
-            props.request().then((data) => {
-                if(props.dataConvert) {
-                    const promise = [] as Promise<any>[];
-                    props.columns?.map(item => {
-                        promise.push(new Promise<any>((resolve, reject) => {
-                            props.dataConvert?.(item, data).then(value => {
-                                data[item.props.name] = value;
-                                resolve(value);
-                            }).catch(reject);
-                        }));
-                    });
-                    Promise.all(promise).then(() => {
-                        setData(data);
-                    });
-                }else {
-                    setData(data);
-                }
-            })
-        }
-    }
-
-    useImperativeHandle(props.actionRef, () => ({
-        reload: () => {
-            reload()
-        }
-    }), [props.actionRef]);
-
-    useEffect(() => {
-        reload();
-
-        return () => {
-            setData(null);
-        }
-    }, []);
-
-    return (
-        <div className={"descriptions-list"}>
-            {props.header}
-            {data && props.columns && props.columns
-                .filter(item => !item.props.hidden)
-                .map((item) => {
-                    const key = item.props.name;
-                    const value = data[key];
-                    const valueType = typeof value === 'object' ? 'object' : 'string';
-                    return (
-                        <div className={"descriptions-list-item"}>
-                            <div className={"descriptions-list-item-label"}
-                                 dangerouslySetInnerHTML={{__html: item.props.label || ""}}/>
-                            {valueType === 'string' && (
-                                <div className={"descriptions-list-item-value"}
-                                     dangerouslySetInnerHTML={{__html: value}}/>
-                            )}
-                            {valueType === 'object' && (
-                                <div className={"descriptions-list-item-value"}>
-                                    {value}
-                                </div>
-                            )}
-                        </div>
-                    )
-                })}
-            {props.footer}
-        </div>
-    )
-}
-
-export default Descriptions;
diff --git a/mobile-ui/src/components/flow/plugins/PostponedFormView.tsx b/mobile-ui/src/components/flow/PostponedFormView.tsx
similarity index 90%
rename from mobile-ui/src/components/flow/plugins/PostponedFormView.tsx
rename to mobile-ui/src/components/flow/PostponedFormView.tsx
index f3707631..7c903cf2 100644
--- a/mobile-ui/src/components/flow/plugins/PostponedFormView.tsx
+++ b/mobile-ui/src/components/flow/PostponedFormView.tsx
@@ -1,9 +1,9 @@
 import React from "react";
-import {PostponedFormProps} from "@/components/flow/types";
+import {PostponedFormProps} from "@codingapi/ui-framework";
 import Popup from "@/components/popup";
 import {DatePickerView} from "antd-mobile";
 import dayjs from "dayjs";
-import {dateLabelRenderer} from "@/components/form/date";
+import {dateLabelRenderer} from "@codingapi/form-mobile";
 
 const PostponedFormView: React.FC<PostponedFormProps> = (props) => {
 
diff --git a/mobile-ui/src/components/flow/plugins/UserSelectFormView.tsx b/mobile-ui/src/components/flow/UserSelectFormView.tsx
similarity index 90%
rename from mobile-ui/src/components/flow/plugins/UserSelectFormView.tsx
rename to mobile-ui/src/components/flow/UserSelectFormView.tsx
index 9c6dfdd1..919e42fa 100644
--- a/mobile-ui/src/components/flow/plugins/UserSelectFormView.tsx
+++ b/mobile-ui/src/components/flow/UserSelectFormView.tsx
@@ -1,8 +1,7 @@
 import React, {useEffect} from "react";
-import {UserSelectFormProps} from "@/components/flow/types";
+import {UserSelectFormProps} from "@codingapi/ui-framework";
 import Popup from "@/components/popup";
-import Form from "@/components/form";
-import FormInput from "@/components/form/input";
+import {Form,FormInput} from "@codingapi/form-mobile";
 
 const UserSelectFormView: React.FC<UserSelectFormProps> = (props) => {
 
diff --git a/mobile-ui/src/components/flow/components/FlowChart.tsx b/mobile-ui/src/components/flow/components/FlowChart.tsx
deleted file mode 100644
index 8b5e2b6a..00000000
--- a/mobile-ui/src/components/flow/components/FlowChart.tsx
+++ /dev/null
@@ -1,93 +0,0 @@
-import React, {useContext, useEffect} from "react";
-import '@logicflow/core/es/index.css';
-import '@logicflow/extension/lib/style/index.css';
-import {LogicFlow, Options} from "@logicflow/core";
-import {DndPanel, Menu, MiniMap, Snapshot} from "@logicflow/extension";
-import {FlowViewReactContext} from "@/components/flow/view";
-import Start from "@/components/flow/nodes/Start";
-import Over from "@/components/flow/nodes/Over";
-import Circulate from "@/components/flow/nodes/Circulate";
-import Node from "@/components/flow/nodes/Node";
-import EdgeType = Options.EdgeType;
-
-interface FlowChartProps {
-    edgeType?: EdgeType;
-}
-
-const FlowChart: React.FC<FlowChartProps> = (props) => {
-
-    const flowViewReactContext = useContext(FlowViewReactContext);
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-    const flowSchema = flowRecordContext?.getFlowSchema();
-
-    const [url, setUrl] = React.useState<string>('');
-
-    const edgeType = props.edgeType || 'polyline';
-    const container = React.useRef<HTMLDivElement>(null);
-    const lfRef = React.useRef<LogicFlow>(null);
-
-    useEffect(() => {
-        const SilentConfig = {
-            isSilentMode: true,
-            stopScrollGraph: false,
-            stopMoveGraph: false,
-            stopZoomGraph: false,
-            edgeTextEdit: false,
-        };
-
-        //@ts-ignore
-        lfRef.current = new LogicFlow({
-            //@ts-ignore
-            container: container.current,
-            ...SilentConfig,
-            background: {
-                backgroundColor: '#f3f5f8'
-            },
-            width: 0,
-            height: 0,
-            plugins: [Menu, DndPanel, MiniMap, Snapshot],
-            grid: false,
-            edgeType: edgeType,
-        });
-
-        lfRef.current.setTheme({
-            bezier: {
-                stroke: '#8f94e3',
-                strokeWidth: 1,
-            },
-            polyline: {
-                stroke: '#8f94e3',
-                strokeWidth: 1,
-            },
-            line: {
-                stroke: '#8f94e3',
-                strokeWidth: 1,
-            },
-        });
-        lfRef.current.register(Start);
-        lfRef.current.register(Node);
-        lfRef.current.register(Over);
-        lfRef.current.register(Circulate);
-        lfRef.current.render(flowSchema);
-
-        setTimeout(() => {
-            lfRef.current?.getSnapshotBlob().then((blob: any) => {
-                setUrl(URL.createObjectURL(blob.data));
-            });
-        }, 100)
-
-    }, [flowViewReactContext]);
-
-    return (
-        <div>
-            <div className="flow-chart">
-                <div className={"flow-chart-content"} ref={container}/>
-                {url && (
-                    <img src={url} className={"flow-img"}/>
-                )}
-            </div>
-        </div>
-    )
-}
-
-export default FlowChart;
diff --git a/mobile-ui/src/components/flow/components/FlowContent.tsx b/mobile-ui/src/components/flow/components/FlowContent.tsx
deleted file mode 100644
index 0949d166..00000000
--- a/mobile-ui/src/components/flow/components/FlowContent.tsx
+++ /dev/null
@@ -1,67 +0,0 @@
-import React, {useContext, useEffect} from "react";
-import {Divider, Tabs} from "antd-mobile";
-import {FlowFormViewProps} from "@/components/flow/types";
-import {FlowViewReactContext} from "@/components/flow/view";
-import FlowHistory from "@/components/flow/components/FlowHistory";
-import FlowFormOpinion from "@/components/flow/components/FlowFormOpinion";
-import {useSelector} from "react-redux";
-import {FlowReduxState} from "@/components/flow/store/FlowSlice";
-import FlowChart from "@/components/flow/components/FlowChart";
-import FlowHistoryLine from "@/components/flow/components/FlowHistoryLine";
-import FlowOpinion from "@/components/flow/components/FlowOpinion";
-
-const FlowContent= () => {
-    const flowViewReactContext = useContext(FlowViewReactContext);
-
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-    const formInstance = flowViewReactContext?.formInstance;
-
-    const FlowFormView = flowRecordContext?.getFlowFormView() as React.ComponentType<FlowFormViewProps>;
-
-    const formParams = flowRecordContext?.getFlowFormParams();
-
-    const opinionVisible = useSelector((state: FlowReduxState) => state.flow.opinionVisible);
-    const dataVersion = useSelector((state: FlowReduxState) => state.flow.dataVersion);
-    const contentHiddenVisible = useSelector((state: FlowReduxState) => state.flow.contentHiddenVisible);
-
-    useEffect(() => {
-        if(!flowRecordContext?.isEditable()){
-            setTimeout(()=>{
-                formInstance?.disableAll();
-            },100);
-        }
-    }, []);
-
-    const style = contentHiddenVisible ? {"display":"none"} : {};
-    return (
-        <div className={"flow-view-content"} style={style}>
-            <Tabs>
-                <Tabs.Tab title='流程详情' key='detail'>
-                    {formInstance && (
-                        <FlowFormView
-                            data={formParams}
-                            form={formInstance}
-                            dataVersion={dataVersion}
-                        />
-                    )}
-
-                    {opinionVisible && (
-                        <FlowFormOpinion/>
-                    )}
-                </Tabs.Tab>
-                <Tabs.Tab title='流程记录' key='record'>
-                    <FlowHistory/>
-                    <Divider>审批记录</Divider>
-                    <FlowOpinion/>
-                </Tabs.Tab>
-                <Tabs.Tab title='流程图' key='chart'>
-                    <FlowChart/>
-                    <Divider>流转历史</Divider>
-                    <FlowHistoryLine/>
-                </Tabs.Tab>
-            </Tabs>
-        </div>
-    )
-}
-
-export default FlowContent;
diff --git a/mobile-ui/src/components/flow/components/FlowFooter.tsx b/mobile-ui/src/components/flow/components/FlowFooter.tsx
deleted file mode 100644
index eea062e5..00000000
--- a/mobile-ui/src/components/flow/components/FlowFooter.tsx
+++ /dev/null
@@ -1,118 +0,0 @@
-import React, {useContext} from "react";
-import {ActionSheet, Button} from "antd-mobile";
-import {FlowViewReactContext} from "@/components/flow/view";
-import {useSelector} from "react-redux";
-import {FlowReduxState} from "@/components/flow/store/FlowSlice";
-import {useNavigate} from "react-router";
-
-interface FlowFooterProps {
-    maxButtonCount?: number;
-}
-
-const FlowFooter: React.FC<FlowFooterProps> = (props) => {
-    const flowViewReactContext = useContext(FlowViewReactContext);
-
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-
-    const flowButtonClickContext = flowViewReactContext?.flowButtonClickContext;
-
-    const buttons = flowRecordContext?.getFlowButtons()||[];
-    const maxButtonCount = props.maxButtonCount || 4;
-    const requestLoading = useSelector((state: FlowReduxState) => state.flow.requestLoading);
-    const contentHiddenVisible = useSelector((state: FlowReduxState) => state.flow.contentHiddenVisible);
-    const [visible, setVisible] = React.useState(false);
-    const navigate = useNavigate();
-
-    const style = contentHiddenVisible ? {"display":"none"} : {};
-
-    if(flowRecordContext?.isEditable()){
-        return (
-            <div className={"flow-view-footer"} style={style}>
-                {buttons && buttons.length <= maxButtonCount && buttons.map((item) => {
-                    const style = item.style && JSON.parse(item.style) || {};
-                    return (
-                        <Button
-                            loading={requestLoading}
-                            key={item.id}
-                            className={"flow-view-footer-button"}
-                            style={{
-                                ...style
-                            }}
-                            onClick={() => {
-                                flowButtonClickContext?.handlerClick(item);
-                            }}
-                        >{item.name}</Button>
-                    )
-                })}
-                {buttons && buttons.length > maxButtonCount && (
-                    <>
-                        {buttons && buttons.slice(0, maxButtonCount - 1).map(item => {
-                            const style = item.style && JSON.parse(item.style) || {};
-                            return (
-                                <Button
-                                    loading={requestLoading}
-                                    key={item.id}
-                                    className={"flow-view-footer-button"}
-                                    style={{
-                                        ...style
-                                    }}
-                                    onClick={() => {
-                                        flowButtonClickContext?.handlerClick(item);
-                                    }}
-                                >{item.name}</Button>
-                            )
-                        })}
-
-                        <Button
-                            loading={requestLoading}
-                            color={"default"}
-                            className={"flow-view-footer-button"}
-                            onClick={() => {
-                                setVisible(true);
-                            }}
-                        >
-                            更多
-                        </Button>
-
-                        <ActionSheet
-                            extra='请选择操作按钮'
-                            cancelText='取消'
-                            visible={visible}
-                            actions={buttons.slice(maxButtonCount - 1).map((item, index) => {
-                                return {
-                                    text: item.name,
-                                    key: item.id,
-                                    onClick: () => {
-                                        flowButtonClickContext?.handlerClick(item);
-                                        setVisible(false);
-                                    }
-                                }
-                            })}
-                            onClose={() => setVisible(false)}
-                        />
-                    </>
-                )}
-
-
-            </div>
-        )
-    }else {
-        return (
-            <div className={"flow-view-footer"} style={style}>
-                <Button
-                    loading={requestLoading}
-                    style={{
-                        marginLeft:'15%',
-                        marginRight:'15%'
-                    }}
-                    className={"flow-view-footer-button"}
-                    onClick={() => {
-                        navigate(-1);
-                    }}
-                >关闭</Button>
-            </div>
-        )
-    }
-}
-
-export default FlowFooter;
diff --git a/mobile-ui/src/components/flow/components/FlowForm404.tsx b/mobile-ui/src/components/flow/components/FlowForm404.tsx
deleted file mode 100644
index 31257336..00000000
--- a/mobile-ui/src/components/flow/components/FlowForm404.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import React from "react";
-import {Button, Result} from "antd-mobile";
-import {useNavigate} from "react-router";
-
-
-const FlowForm404 = ()=>{
-
-    const navigate = useNavigate();
-
-    return (
-        <Result
-            status='error'
-            title={"抱歉，没有配置流程视图"}
-            description={(
-                <div className={"flow-result-content"}>
-                    <Button
-                        className={"flow-result-content-button"}
-                        block={true}
-                        onClick={()=>{
-                            navigate(-1);
-                        }}
-                    >关闭页面</Button>
-                </div>
-            )}
-        />
-    )
-}
-
-export default FlowForm404;
diff --git a/mobile-ui/src/components/flow/components/FlowFormOpinion.tsx b/mobile-ui/src/components/flow/components/FlowFormOpinion.tsx
deleted file mode 100644
index fe300015..00000000
--- a/mobile-ui/src/components/flow/components/FlowFormOpinion.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import React, {useContext, useEffect} from "react";
-import Form from "@/components/form";
-import {FlowViewReactContext} from "@/components/flow/view";
-
-
-const FlowFormOpinion = ()=>{
-
-    const flowViewReactContext = useContext(FlowViewReactContext);
-    const opinionInstance = flowViewReactContext?.opinionInstance;
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-
-    useEffect(() => {
-        opinionInstance?.setFieldValue("advice", flowRecordContext?.getOpinionAdvice());
-    }, []);
-
-    return (
-        <>
-            <Form
-                form={opinionInstance}
-                loadFields={async ()=>{
-                    return [
-                        {
-                            type:'textarea',
-                            props:{
-                                name:"advice",
-                                label:"审批意见",
-                                textAreaRows:2,
-                                required:true,
-                                validateFunction:async (content)=>{
-                                    const value = content.value;
-                                    if(value){
-                                        return [];
-                                    }
-                                    return ["请输入审批意见"];
-                                }
-                            }
-                        }
-                    ]
-                }}
-            >
-            </Form>
-        </>
-    )
-}
-
-export default FlowFormOpinion;
diff --git a/mobile-ui/src/components/flow/components/FlowHistory.tsx b/mobile-ui/src/components/flow/components/FlowHistory.tsx
deleted file mode 100644
index 25faa305..00000000
--- a/mobile-ui/src/components/flow/components/FlowHistory.tsx
+++ /dev/null
@@ -1,167 +0,0 @@
-import React, {useContext} from "react";
-import {FlowViewReactContext} from "@/components/flow/view";
-import Descriptions from "@/components/descriptions";
-import {FormField} from "@/components/form/types";
-import moment from "moment";
-import {Tag} from "antd-mobile";
-
-const fields = [
-    {
-        type: 'input',
-        props: {
-            name: 'title',
-            label: '',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'createOperatorName',
-            label: '发起人',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'createOperatorDate',
-            label: '发起时间',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'flowStatus',
-            label: '状态',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'recodeType',
-            label: '流程状态',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'postponedCount',
-            label: '是否延期',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'interfere',
-            label: '是否干预',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'read',
-            label: '是否已读',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'timeoutTime',
-            label: '超时时间',
-        }
-    },
-    {
-        type: 'input',
-        props: {
-            name: 'nodeName',
-            label: '节点名称',
-        }
-    }
-] as FormField[];
-
-const flowStatusConvert = (data: any) => {
-    if (data.flowStatus === 'RUNNING') {
-        return '进行中';
-    }
-    if (data.flowStatus === 'FINISH') {
-        return '已结束';
-    }
-    return '';
-}
-
-const recodeTypeConvert = (data: any) => {
-    if (data.flowType === 'TODO') {
-        return <Tag color={'primary'}>待办</Tag>;
-    }
-    if (data.flowType === 'DONE') {
-        return <Tag color={'success'}>已办</Tag>;
-    }
-    if (data.flowType === 'TRANSFER') {
-        return <Tag color={'blue'}>已转办</Tag>;
-    }
-    return '';
-}
-
-const postponedCountConvert = (data: any) => {
-    if (data.postponedCount > 0) {
-        return '延期';
-    }
-    return '未延期';
-}
-
-const interfereConvert = (data: any) => {
-    if (data.interfere) {
-        return '干预';
-    }
-    return '未干预';
-}
-
-const readConvert = (data: any) => {
-    if (data.read) {
-        return '已读';
-    }
-    return '未读';
-}
-
-const timeoutTimeConvert = (data: any) => {
-    if (data.timeoutTime == 0) {
-        return '未设置';
-    }
-    return moment(data.timeoutTime).format("YYYY-MM-DD HH:mm:ss");
-}
-
-
-const FlowHistory = () => {
-    const flowViewReactContext = useContext(FlowViewReactContext);
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-
-    const currentFlowRecord = flowRecordContext?.getCurrentFlowRecord();
-
-    if(currentFlowRecord) {
-        return (
-            <div className={"flow-history"}>
-                <div className={"flow-basic"}>
-                    <Descriptions
-                        columns={fields}
-                        request={async () => {
-                            return {
-                                ...currentFlowRecord,
-                                createOperatorName: currentFlowRecord.createOperator?.name,
-                                createOperatorDate: moment(currentFlowRecord.createTime).format('YYYY-MM-DD HH:mm:ss'),
-                                flowStatus: flowStatusConvert(currentFlowRecord),
-                                recodeType: recodeTypeConvert(currentFlowRecord),
-                                postponedCount: postponedCountConvert(currentFlowRecord),
-                                interfere: interfereConvert(currentFlowRecord),
-                                read: readConvert(currentFlowRecord),
-                                timeoutTime: timeoutTimeConvert(currentFlowRecord),
-                                nodeName: flowRecordContext?.getNode(currentFlowRecord.nodeCode)?.name,
-                            };
-                        }}
-                    />
-                </div>
-            </div>
-        )
-    }
-    return <></>
-}
-
-export default FlowHistory;
diff --git a/mobile-ui/src/components/flow/components/FlowHistoryLine.tsx b/mobile-ui/src/components/flow/components/FlowHistoryLine.tsx
deleted file mode 100644
index 6ffeb24c..00000000
--- a/mobile-ui/src/components/flow/components/FlowHistoryLine.tsx
+++ /dev/null
@@ -1,55 +0,0 @@
-import React, {useContext} from "react";
-import {FlowViewReactContext} from "@/components/flow/view";
-import moment from "moment";
-import {Tag} from "antd-mobile";
-
-const recodeTypeConvert = (data: any) => {
-    if (data.flowType === 'TODO') {
-        return <Tag color={'primary'}>待办</Tag>;
-    }
-    if (data.flowType === 'DONE') {
-        return <Tag color={'success'}>已办</Tag>;
-    }
-    if (data.flowType === 'TRANSFER') {
-        return <Tag color={'blue'}>已转办</Tag>;
-    }
-    return '';
-}
-
-
-const FlowHistoryLine = () => {
-    const flowViewReactContext = useContext(FlowViewReactContext);
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-
-    const historyRecords = flowRecordContext?.getHistoryRecords();
-
-    return (
-        <div className={"flow-history"}>
-            <div className={"flow-history-list"}>
-                {historyRecords && historyRecords.map((historyRecord: any, index: number) => {
-                    const nodeName = flowRecordContext?.getNode(historyRecord.nodeCode)?.name;
-                    const recodeType = recodeTypeConvert(historyRecord);
-                    const createName = historyRecord.createOperator?.name;
-                    const createTime = moment(historyRecord.createTime).format('YYYY-MM-DD HH:mm:ss');
-                    const flowAdvice = historyRecord.opinion?.advice || '暂无意见';
-                    return (
-                        <div className={"flow-history-list-item"}>
-                            <div className={"flow-history-list-item-line"}>
-                                {historyRecords.length > (index + 1) &&  <div className={"flow-history-list-item-dot"}/>}
-                            </div>
-                            <div className={"flow-history-list-item-content"}>
-                                <div className={"flow-history-list-item-title"}>{nodeName}</div>
-                                <div className={"flow-history-list-item-attr"}>状态:{recodeType}</div>
-                                <div className={"flow-history-list-item-attr"}>创建人:{createName}</div>
-                                <div className={"flow-history-list-item-attr"}>创建时间:{createTime}</div>
-                                <div className={"flow-history-list-item-attr"}>审批意见:{flowAdvice}</div>
-                            </div>
-                        </div>
-                    )
-                })}
-            </div>
-        </div>
-    )
-}
-
-export default FlowHistoryLine;
diff --git a/mobile-ui/src/components/flow/components/FlowOpinion.tsx b/mobile-ui/src/components/flow/components/FlowOpinion.tsx
deleted file mode 100644
index 4ff19b83..00000000
--- a/mobile-ui/src/components/flow/components/FlowOpinion.tsx
+++ /dev/null
@@ -1,54 +0,0 @@
-import React, {useContext} from "react";
-import {FlowViewReactContext} from "@/components/flow/view";
-import moment from "moment";
-
-
-const optionStateConvert = (data: any) => {
-    if (data.opinion.result === 1) {
-        return '转办'
-    }
-    if (data.opinion.result === 2) {
-        return '通过'
-    }
-    if (data.opinion.result === 3) {
-        return '驳回'
-    }
-    return '暂存'
-}
-
-const FlowOpinion = () => {
-
-    const flowViewReactContext = useContext(FlowViewReactContext);
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-
-    const historyOpinions = flowRecordContext?.getHistoryOpinions();
-
-    return (
-        <>
-            {historyOpinions && historyOpinions.map((item: any) => {
-                const flowOperatorName = item.operator.name;
-                const optionState = optionStateConvert(item);
-                const createTime = moment(item.createTime).format("YYYY-MM-DD HH:mm:ss");
-                const advice = item.opinion.advice;
-                return (
-                    <div className={"flow-history-opinion-item"}>
-                        <div className={"flow-history-opinion-item-row"}>
-                            <span>审批人：</span>
-                            <span>{flowOperatorName} {optionState}</span>
-                        </div>
-                        <div className={"flow-history-opinion-item-row"}>
-                            <span>审批时间：</span>
-                            <span>{createTime}</span>
-                        </div>
-                        <div className={"flow-history-opinion-item-row"}>
-                            <span>审批意见：</span>
-                            <span>{advice}</span>
-                        </div>
-                    </div>
-                )
-            })}
-        </>
-    )
-}
-
-export default FlowOpinion;
diff --git a/mobile-ui/src/components/flow/components/FlowPage.tsx b/mobile-ui/src/components/flow/components/FlowPage.tsx
deleted file mode 100644
index 36a8edc6..00000000
--- a/mobile-ui/src/components/flow/components/FlowPage.tsx
+++ /dev/null
@@ -1,134 +0,0 @@
-import React, {useEffect} from "react";
-import {
-    FlowFormViewProps,
-    FlowViewProps,
-    PostponedFormProps,
-    PostponedFormViewKey,
-    UserSelectFormProps,
-    UserSelectFormViewKey
-} from "@/components/flow/types";
-import {useDispatch, useSelector} from "react-redux";
-import {FlowReduxState, updateState} from "@/components/flow/store/FlowSlice";
-import {FlowRecordContext} from "@/components/flow/domain/FlowRecordContext";
-import Form from "@/components/form";
-import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
-import {FlowEventContext} from "@/components/flow/domain/FlowEventContext";
-import FlowResult from "@/components/flow/components/FlowResult";
-import FlowContent from "@/components/flow/components/FlowContent";
-import FlowFooter from "@/components/flow/components/FlowFooter";
-import {FlowViewReactContext} from "@/components/flow/view";
-import FlowForm404 from "@/components/flow/components/FlowForm404";
-import ComponentBus from "@/framework/ComponentBus";
-import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
-import {FlowButtonClickContext} from "@/components/flow/domain/FlowButtonClickContext";
-
-
-interface FlowPageProps extends FlowViewProps {
-    // 流程详情数据
-    flowData: any;
-}
-
-const FlowPage: React.FC<FlowPageProps> = (props) => {
-
-    const dispatch = useDispatch();
-
-    const currentState = useSelector((state: FlowReduxState) => state.flow);
-    const flowRecordContext = new FlowRecordContext(props, props.flowData);
-    const formInstance = Form.useForm();
-    const opinionInstance = Form.useForm();
-
-    const flowStateContext = new FlowStateContext(currentState, (state: any) => {
-        dispatch(updateState({
-            ...state
-        }));
-    });
-    const flowTriggerContext = new FlowTriggerContext();
-    const flowEvenContext = new FlowEventContext(flowRecordContext, flowTriggerContext, formInstance, opinionInstance, flowStateContext);
-    const flowButtonClickContext = new FlowButtonClickContext(flowEvenContext, flowStateContext);
-    const FlowFormView = flowRecordContext.getFlowFormView() as React.ComponentType<FlowFormViewProps>;
-
-    // 延期表单视图
-    const PostponedFormView = ComponentBus.getInstance().getComponent<PostponedFormProps>(PostponedFormViewKey);
-    // 选人表单视图
-    const UserSelectFormView = ComponentBus.getInstance().getComponent<UserSelectFormProps>(UserSelectFormViewKey);
-
-    const version = useSelector((state: FlowReduxState) => state.flow.version);
-
-    // 设置流程编号
-    useEffect(() => {
-        if (props.id) {
-            flowStateContext.setRecordId(props.id);
-        }
-    }, [version]);
-
-    if (FlowFormView) {
-        return (
-            <FlowViewReactContext.Provider value={{
-                flowRecordContext: flowRecordContext,
-                flowEventContext: flowEvenContext,
-                flowStateContext: flowStateContext,
-                flowTriggerContext: flowTriggerContext,
-                flowButtonClickContext: flowButtonClickContext,
-
-                formInstance: formInstance,
-                opinionInstance: opinionInstance
-            }}>
-                <div className={"flow-view"}>
-                    {currentState.result && (
-                        <FlowResult/>
-                    )}
-                    <FlowContent/>
-                    <FlowFooter/>
-                </div>
-
-                {PostponedFormView && (
-                    <PostponedFormView
-                        visible={currentState.postponedVisible}
-                        setVisible={(visible: boolean) => {
-                            flowStateContext.setPostponedVisible(visible);
-                        }}
-                        onFinish={(timeOut) => {
-                            flowEvenContext.postponedFlow(timeOut, (res) => {
-                                flowStateContext.setResult({
-                                    title: '延期成功',
-                                    state: 'success',
-                                    closeable: true,
-                                    items: [
-                                        {
-                                            label: '延期时间',
-                                            value: `${timeOut}小时`
-                                        }
-                                    ]
-                                })
-                            });
-                        }}
-                    />
-                )}
-
-                {UserSelectFormView && currentState.userSelectMode && (
-                    <UserSelectFormView
-                        visible={currentState.userSelectVisible}
-                        setVisible={(visible: boolean) => {
-                            flowStateContext.setUserSelectVisible(visible);
-                        }}
-                        onFinish={(users) => {
-                            // 选择的人
-                            flowEvenContext.userSelectCallback(users, currentState.userSelectMode);
-                        }}
-                        multiple={currentState.userSelectMode.multiple}
-                        specifyUserIds={currentState.userSelectMode.specifyUserIds}
-                        currentUserIds={currentState.userSelectMode.currentUserIds}
-                        userSelectType={currentState.userSelectMode.userSelectType}
-                    />
-                )}
-
-            </FlowViewReactContext.Provider>
-        )
-    } else {
-        return (
-            <FlowForm404/>
-        )
-    }
-}
-
-export default FlowPage;
diff --git a/mobile-ui/src/components/flow/components/FlowRecord.tsx b/mobile-ui/src/components/flow/components/FlowRecord.tsx
deleted file mode 100644
index 4362e1c8..00000000
--- a/mobile-ui/src/components/flow/components/FlowRecord.tsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import React, {useContext} from "react";
-import {FlowViewReactContext} from "@/components/flow/view";
-
-
-const FlowRecord = () => {
-    const flowViewReactContext = useContext(FlowViewReactContext);
-    const flowRecordContext = flowViewReactContext?.flowRecordContext;
-
-    const historyRecords = flowRecordContext?.getHistoryRecords();
-
-    return (
-        <div>
-            <div className={"flow-history-row-title"}>流程历史记录</div>
-
-            <div className={"flow-history-list"}>
-                {historyRecords && historyRecords.map((item: any) => {
-                    return (
-                        <div>
-                            <div>{item.title}</div>
-                        </div>
-                    )
-                })}
-            </div>
-
-        </div>
-    )
-}
-
-export default FlowRecord;
diff --git a/mobile-ui/src/components/flow/components/FlowResult.tsx b/mobile-ui/src/components/flow/components/FlowResult.tsx
deleted file mode 100644
index c0554e52..00000000
--- a/mobile-ui/src/components/flow/components/FlowResult.tsx
+++ /dev/null
@@ -1,50 +0,0 @@
-import React, {useContext} from "react";
-import {Button, Result} from "antd-mobile";
-import {useSelector} from "react-redux";
-import {FlowReduxState} from "@/components/flow/store/FlowSlice";
-import {useNavigate} from "react-router";
-import {FlowViewReactContext} from "@/components/flow/view";
-
-
-const FlowResult = () => {
-
-    const result = useSelector((state: FlowReduxState) => state.flow.result);
-    const navigate = useNavigate();
-
-    const flowViewReactContext = useContext(FlowViewReactContext);
-
-    return (
-        <Result
-            status={result?.state}
-            title={result?.title}
-            description={(
-                <div className={"flow-result-content"}>
-                    {result && result.items && result.items.map((item) => {
-                        return (
-                            <div className={"flow-result-content-item"}>
-                                <div className={"flow-result-content-item-label"}>{item.label}:</div>
-                                <div className={"flow-result-content-item-value"}>{item.value}</div>
-                            </div>
-                        )
-                    })}
-
-                    <div className={"flow-result-content-footer"}>
-                        <Button
-                            className={"flow-result-content-button"}
-                            block={true}
-                            onClick={() => {
-                                if (result && result.closeable) {
-                                    navigate(-1);
-                                }else {
-                                    flowViewReactContext?.flowStateContext?.clearResult();
-                                }
-                            }}
-                        >关闭页面</Button>
-                    </div>
-                </div>
-            )}
-        />
-    )
-}
-
-export default FlowResult;
diff --git a/mobile-ui/src/components/flow/domain/FlowButtonClickContext.ts b/mobile-ui/src/components/flow/domain/FlowButtonClickContext.ts
deleted file mode 100644
index 4a0f8a4d..00000000
--- a/mobile-ui/src/components/flow/domain/FlowButtonClickContext.ts
+++ /dev/null
@@ -1,316 +0,0 @@
-import {FlowButton} from "@/components/flow/types";
-import {Toast} from "antd-mobile";
-import {FlowSubmitResultParser, FlowTrySubmitResultParser} from "@/components/flow/domain/FlowResultParser";
-import {FlowEventContext} from "@/components/flow/domain/FlowEventContext";
-import {FlowStateContext} from "./FlowStateContext";
-
-// 流程按钮事件点击触发器
-export class FlowButtonClickContext {
-
-    private readonly flowEventContext: FlowEventContext;
-    private readonly flowStateContext: FlowStateContext;
-
-    constructor(flowEventContext: FlowEventContext,
-                flowStateContext: FlowStateContext) {
-        this.flowEventContext = flowEventContext;
-        this.flowStateContext = flowStateContext;
-    }
-
-
-    /**
-     * 触发刷新动作
-     */
-    handlerReload(){
-        this.flowEventContext?.reloadFlow();
-    }
-
-    /**
-     * 触发保存动作
-     */
-    handlerSave(){
-        if (this.flowStateContext?.hasRecordId()) {
-            this.flowEventContext?.saveFlow(() => {
-                Toast.show('流程保存成功');
-            })
-        } else {
-            this.flowEventContext?.startFlow(() => {
-                this.flowEventContext?.saveFlow(() => {
-                    Toast.show('流程保存成功');
-                })
-            });
-        }
-    }
-
-    /**
-     * 触发发起动作
-     */
-    handlerStart(){
-        if (this.flowStateContext?.hasRecordId()) {
-            Toast.show('流程已发起，无需重复发起');
-        } else {
-            this.flowEventContext?.startFlow((res) => {
-                Toast.show('流程发起成功.');
-            })
-        }
-    }
-
-    /**
-     * 指定人提交流程
-     * @param approvalState 审批状态 同意为true 驳回为false
-     * @param operatorIds 流程操作人员id
-     */
-    handlerSpecifyOperatorSubmit(approvalState:boolean,operatorIds:number[]){
-        this.flowEventContext?.submitFlow(true, (res) => {
-            const flowSubmitResultParser = new FlowSubmitResultParser(res.data);
-            this.flowStateContext.setResult(flowSubmitResultParser.parser());
-        }, operatorIds);
-    }
-
-    /**
-     * 触发指定人提交动作
-     */
-    handlerSpecifySubmit(){
-        const trySpecifySubmitHandler = ()=>{
-            this.flowEventContext?.trySubmitFlow((res) => {
-                const operators = res.data.operators;
-                const userIds = operators.map((item: any) => {
-                    return item.userId;
-                });
-                this.flowStateContext?.setUserSelectMode({
-                    userSelectType: 'nextNodeUser',
-                    multiple: true,
-                    specifyUserIds: userIds,
-                });
-            });
-        }
-        if (this.flowStateContext?.hasRecordId()) {
-            trySpecifySubmitHandler();
-        }else {
-            this.flowEventContext?.startFlow(() => {
-                trySpecifySubmitHandler();
-            });
-        }
-    }
-
-    /**
-     * 触发提交动作
-     */
-    handlerSubmit(){
-        const submitHandler = ()=>{
-            this.flowEventContext?.submitFlow(true, (res) => {
-                const flowSubmitResultParser = new FlowSubmitResultParser(res.data);
-                this.flowStateContext?.setResult(flowSubmitResultParser.parser());
-            })
-        }
-        if (this.flowStateContext?.hasRecordId()) {
-            submitHandler();
-        } else {
-            this.flowEventContext?.startFlow(() => {
-                submitHandler();
-            });
-        }
-    }
-
-    /**
-     * 触发驳回动作
-     */
-    handlerReject(){
-        if (this.flowStateContext?.hasRecordId()) {
-            this.flowEventContext?.submitFlow(false, (res) => {
-                const flowSubmitResultParser = new FlowSubmitResultParser(res.data);
-                this.flowStateContext?.setResult(flowSubmitResultParser.parser());
-            })
-        } else {
-            Toast.show('流程尚未发起，无法操作');
-        }
-    }
-
-    /**
-     * 触发尝试提交动作
-     */
-    handlerTrySubmit(){
-        const trySubmitHandler = ()=>{
-            this.flowEventContext?.trySubmitFlow((res) => {
-                const flowTrySubmitResultParser = new FlowTrySubmitResultParser(res.data);
-                this.flowStateContext?.setResult(flowTrySubmitResultParser.parser());
-            });
-        }
-        if (this.flowStateContext?.hasRecordId()) {
-            trySubmitHandler();
-        }else {
-            this.flowEventContext?.startFlow(() => {
-                trySubmitHandler();
-            });
-        }
-    }
-
-    /**
-     * 触发撤回动作
-     */
-    handlerRecall(){
-        this.flowEventContext?.recallFlow(() => {
-            this.flowStateContext?.setResult({
-                state: 'success',
-                closeable: true,
-                title: '流程撤回成功',
-            });
-        });
-    }
-
-    /**
-     * 触发删除动作
-     */
-    handlerRemove(){
-        if (this.flowStateContext?.hasRecordId()) {
-            this.flowEventContext?.removeFlow(() => {
-                this.flowStateContext?.setResult({
-                    state: 'success',
-                    closeable: true,
-                    title: '流程删除成功',
-                });
-            });
-        } else {
-            Toast.show('流程尚未发起，无法删除');
-        }
-    }
-
-    /**
-     * 触发催办动作
-     */
-    handlerUrge(){
-        this.flowEventContext?.urgeFlow(() => {
-            this.flowStateContext?.setResult({
-                state: 'success',
-                closeable: true,
-                title: '催办提醒已发送',
-            });
-        });
-    }
-
-    /**
-     * 触发延期动作
-     */
-    handlerPostponed(){
-        if (this.flowStateContext?.hasRecordId()) {
-            this.flowStateContext?.setPostponedVisible(true);
-        }else {
-            Toast.show('流程尚未发起，无法操作');
-        }
-    }
-
-    /**
-     * 触发转办动作
-     */
-    handlerTransfer(){
-        if (this.flowStateContext?.hasRecordId()) {
-            this.flowStateContext?.setUserSelectMode({
-                userSelectType: 'transfer',
-                multiple: false,
-            });
-        }else {
-            Toast.show('流程尚未发起，无法操作');
-        }
-    }
-
-    /**
-     * 触发自定义接口动作
-     * @param buttonId 自定义按钮的id
-     */
-    handlerCustom(buttonId:string){
-        const customHandler = ()=>{
-            this.flowEventContext?.customFlow(buttonId, (res) => {
-                const customMessage = res.data;
-                this.flowStateContext?.setResult({
-                    state: customMessage.resultState.toLowerCase(),
-                    ...customMessage
-                });
-            });
-        }
-        if (this.flowStateContext?.hasRecordId()) {
-            customHandler();
-        } else {
-            this.flowEventContext?.startFlow((res) => {
-                customHandler();
-            });
-        }
-    }
-
-    /**
-     * 触发自定义前端动作
-     * @param eventKey 自定义按钮的事件key
-     */
-    handlerView(eventKey:string){
-        const viewHandler = ()=>{
-            this.flowEventContext?.triggerEvent(eventKey);
-        }
-
-        if (this.flowStateContext?.hasRecordId()) {
-            viewHandler();
-        }else {
-            this.flowEventContext?.startFlow((res) => {
-                viewHandler();
-            });
-        }
-    }
-
-    /**
-     * 处理按钮点击事件
-     * @param button
-     */
-    handlerClick(button: FlowButton) {
-        if (button.type === "RELOAD") {
-            this.handlerReload();
-        }
-
-        if (button.type === 'SAVE') {
-            this.handlerSave();
-        }
-
-        if (button.type === "START") {
-            this.handlerStart();
-        }
-        if (button.type === 'SPECIFY_SUBMIT') {
-            this.handlerSpecifySubmit();
-        }
-
-        if (button.type === 'SUBMIT') {
-            this.handlerSubmit();
-        }
-
-        if (button.type === 'REJECT') {
-            this.handlerReject();
-        }
-
-        if (button.type === 'TRY_SUBMIT') {
-            this.handlerTrySubmit();
-        }
-
-        if (button.type === 'RECALL') {
-            this.handlerRecall();
-        }
-
-        if (button.type === 'REMOVE') {
-            this.handlerRemove();
-        }
-
-        if (button.type === 'URGE') {
-            this.handlerUrge()
-        }
-
-        if (button.type === 'POSTPONED') {
-            this.handlerPostponed();
-        }
-
-        if (button.type === 'TRANSFER') {
-            this.handlerTransfer();
-        }
-
-        if (button.type === "CUSTOM") {
-            this.handlerCustom(button.id);
-        }
-
-        if (button.type === 'VIEW') {
-            this.handlerView(button.eventKey);
-        }
-    }
-}
diff --git a/mobile-ui/src/components/flow/domain/FlowEventContext.ts b/mobile-ui/src/components/flow/domain/FlowEventContext.ts
deleted file mode 100644
index b05a3d80..00000000
--- a/mobile-ui/src/components/flow/domain/FlowEventContext.ts
+++ /dev/null
@@ -1,348 +0,0 @@
-import {FlowRecordContext} from "@/components/flow/domain/FlowRecordContext";
-import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
-import * as flowApi from "@/api/flow";
-import {FlowUser} from "@/components/flow/types";
-import {FlowSubmitResultParser} from "@/components/flow/domain/FlowResultParser";
-import {UserSelectMode} from "@/components/flow/store/FlowSlice";
-import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-/**
- * 流程的事件控制上下文对象
- */
-export class FlowEventContext {
-
-    private readonly flowRecordContext: FlowRecordContext;
-    private readonly flowTriggerContext: FlowTriggerContext;
-    private readonly flowInstance: FormInstance;
-    private readonly opinionInstance: FormInstance;
-    private readonly flowStateContext: FlowStateContext;
-
-    constructor(flowViewContext: FlowRecordContext,
-                flowTriggerContext:FlowTriggerContext,
-                flowInstance: FormInstance,
-                opinionInstance: FormInstance,
-                flowStateContext: FlowStateContext) {
-        this.flowRecordContext = flowViewContext;
-        this.flowTriggerContext = flowTriggerContext;
-        this.flowInstance = flowInstance;
-        this.opinionInstance = opinionInstance;
-        this.flowStateContext = flowStateContext;
-    }
-
-    private getRequestBody = () => {
-        const formData = this.flowInstance.getFieldsValue();
-        const flowData = this.flowRecordContext.getFlowFormParams();
-        const workCode = this.flowRecordContext.getWorkCode();
-        const recordId = this.flowStateContext.getRecordId();
-        const advice = this.opinionInstance.getFieldsValue();
-
-        return {
-            recordId,
-            workCode,
-            ...advice,
-            formData: {
-                ...flowData,
-                ...formData,
-            }
-        }
-    }
-
-
-    private validateForm = async () => {
-        const formState = await this.flowInstance.validate();
-        const opinionState = await this.opinionInstance.validate();
-        return formState && opinionState;
-    }
-
-    /**
-     * 发起流程
-     * @param callback 回调函数
-     */
-    startFlow = (callback?: (res: any) => void) => {
-        const body = this.getRequestBody();
-        this.flowStateContext.setRequestLoading(true);
-        flowApi.startFlow(body)
-            .then(res => {
-                if (res.success) {
-                    const newRecordId = res.data.records[0].id;
-                    this.flowStateContext.setRecordId(newRecordId);
-
-                    if (callback) {
-                        callback(res);
-                    }
-                }
-            })
-            .finally(() => {
-                this.flowStateContext.setRequestLoading(false);
-            })
-    }
-
-
-    /**
-     * 提交流程
-     * @param approvalState 是否审批通过
-     * @param callback 回调函数
-     * @param operatorIds 指定审批人
-     */
-    submitFlow = (approvalState: boolean, callback?: (res: any) => void, operatorIds?: number[]) => {
-        this.validateForm().then((validateState) => {
-            if (validateState) {
-                const body = {
-                    ...this.getRequestBody(),
-                    success: approvalState,
-                    operatorIds: operatorIds,
-                }
-                this.flowStateContext.setRequestLoading(true);
-                flowApi.submitFlow(body)
-                    .then(res => {
-                        if (res.success) {
-                            if (callback) {
-                                callback(res);
-                            }
-                        }
-                    })
-                    .finally(() => {
-                        this.flowStateContext.setRequestLoading(false);
-                    })
-            }
-        })
-    }
-
-    /**
-     * 删除流程
-     * @param callback 回调函数
-     */
-    removeFlow = (callback?: (res: any) => void) => {
-        this.flowStateContext.setRequestLoading(true);
-        const body = {
-            recordId: this.flowStateContext.getRecordId()
-        };
-        flowApi.removeFlow(body).then(res => {
-            if (res.success) {
-                if (callback) {
-                    callback(res);
-                }
-            }
-        }).finally(() => {
-            this.flowStateContext.setRequestLoading(false);
-        })
-    }
-
-    /**
-     * 保存流程
-     * @param callback 回调函数
-     */
-    saveFlow = (callback?: (res: any) => void) => {
-        this.flowStateContext.setRequestLoading(true);
-        const body = this.getRequestBody();
-        flowApi.saveFlow(body).then(res => {
-            if (res.success) {
-                if (callback) {
-                    callback(res);
-                }
-            }
-        }).finally(() => {
-            this.flowStateContext.setRequestLoading(false);
-        })
-    }
-
-    /**
-     * 延期流程
-     * @param timeOut 延期时间
-     * @param callback 回调函数
-     */
-    postponedFlow(timeOut: number, callback?: (res: any) => void) {
-        this.flowStateContext.setRequestLoading(true);
-        const body = {
-            recordId: this.flowStateContext.getRecordId(),
-            timeOut
-        };
-        flowApi.postponed(body).then(res => {
-            if (res.success) {
-                if (callback) {
-                    callback(res);
-                }
-            }
-        }).finally(() => {
-            this.flowStateContext.setRequestLoading(false);
-        })
-    }
-
-    /**
-     * 自定义流程
-     * @param buttonId 自定义按钮Id
-     * @param callback 回调函数
-     */
-    customFlow(buttonId: string, callback?: (res: any) => void) {
-        this.validateForm().then((validateState) => {
-            console.log('validateState', validateState);
-            if (validateState) {
-                const body = {
-                    ...this.getRequestBody(),
-                    buttonId: buttonId,
-                }
-                this.flowStateContext.setRequestLoading(true);
-                flowApi.custom(body)
-                    .then(res => {
-                        if (res.success) {
-                            if (callback) {
-                                callback(res);
-                            }
-                        }
-                    })
-                    .finally(() => {
-                        this.flowStateContext.setRequestLoading(false);
-                    })
-            }
-        })
-    }
-
-    /**
-     * 转办流程
-     * @param user 转办用户
-     * @param callback 回调函数
-     */
-    transferFlow(user: FlowUser, callback?: (res: any) => void) {
-        this.validateForm().then((validateState) => {
-            if (validateState) {
-                const body = {
-                    ...this.getRequestBody(),
-                    targetUserId: user.id
-                }
-                this.flowStateContext.setRequestLoading(true);
-                flowApi.transfer(body)
-                    .then(res => {
-                        if (res.success) {
-                            if (callback) {
-                                callback(res);
-                            }
-                        }
-                    })
-                    .finally(() => {
-                        this.flowStateContext.setRequestLoading(false);
-                    })
-            }
-        })
-    }
-
-    /**
-     * 催办流程
-     * @param callback
-     */
-    urgeFlow(callback?: (res: any) => void) {
-        this.flowStateContext.setRequestLoading(true);
-        const body = {
-            recordId: this.flowStateContext.getRecordId()
-        };
-        flowApi.urge(body).then(res => {
-            if (res.success) {
-                if (callback) {
-                    callback(res);
-                }
-            }
-        }).finally(() => {
-            this.flowStateContext.setRequestLoading(false);
-        })
-    }
-
-    /**
-     * 撤回流程
-     */
-    recallFlow(callback?: (res: any) => void) {
-        this.flowStateContext.setRequestLoading(true);
-        const body = {
-            recordId: this.flowStateContext.getRecordId()
-        };
-        flowApi.recall(body).then(res => {
-            if (res.success) {
-                if (callback) {
-                    callback(res);
-                }
-            }
-        }).finally(() => {
-            this.flowStateContext.setRequestLoading(false);
-        })
-    }
-
-    /**
-     * 预提交流程
-     * @param callback
-     */
-    trySubmitFlow(callback?: (res: any) => void) {
-        this.validateForm().then((validateState) => {
-            if (validateState) {
-                const body = {
-                    ...this.getRequestBody(),
-                    success: true,
-                }
-                this.flowStateContext.setRequestLoading(true);
-                flowApi.trySubmitFlow(body)
-                    .then(res => {
-                        if (res.success) {
-                            if (callback) {
-                                callback(res);
-                            }
-                        }
-                    })
-                    .finally(() => {
-                        this.flowStateContext.setRequestLoading(false);
-                    })
-            }
-        })
-    }
-
-
-    /**
-     * 重新加载流程数据
-     */
-    reloadFlow() {
-        this.flowStateContext.randomVersion();
-    }
-
-
-    /**
-     * 触发流程事件
-     */
-    triggerEvent(eventKey:string){
-        this.flowTriggerContext.triggerEvent(eventKey);
-    }
-
-    /**
-     * 用户选择回调
-     * @param users 选择用户
-     * @param userSelectMode 用户选择模式
-     */
-    userSelectCallback(users: FlowUser[], userSelectMode: UserSelectMode | null) {
-        if (users.length > 0) {
-            if (userSelectMode) {
-                if (userSelectMode.userSelectType === 'transfer') {
-                    const targetUser = users[0];
-                    this.transferFlow(targetUser, (res) => {
-                        const message = `已经成功转办给${targetUser.name}`;
-                        this.flowStateContext.setResult({
-                            state: 'success',
-                            closeable: true,
-                            title: message,
-                        });
-                    });
-                }
-                if (userSelectMode.userSelectType === 'nextNodeUser') {
-                    const userIds = users.map((item: any) => {
-                        return item.id;
-                    });
-                    this.submitFlow(true, (res) => {
-                        const flowSubmitResultParser = new FlowSubmitResultParser(res.data);
-                        this.flowStateContext.setResult(flowSubmitResultParser.parser());
-                    }, userIds);
-                }
-            }
-        }
-
-        this.flowStateContext.setUserSelectVisible(false);
-    }
-
-}
-
-
-
diff --git a/mobile-ui/src/components/flow/domain/FlowRecordContext.ts b/mobile-ui/src/components/flow/domain/FlowRecordContext.ts
deleted file mode 100644
index 69fa1339..00000000
--- a/mobile-ui/src/components/flow/domain/FlowRecordContext.ts
+++ /dev/null
@@ -1,211 +0,0 @@
-import {FlowButton, FlowFormView, FlowViewProps} from "@/components/flow/types";
-
-/**
- * 流程的详情控制上下文对象
- */
-export class FlowRecordContext {
-
-    private readonly props: FlowViewProps;
-    private readonly data: any;
-
-    constructor(props: FlowViewProps, data?: any) {
-        this.props = props;
-        this.data = data;
-    }
-
-    // 获取流程的工作编码
-    getWorkCode() {
-        return this.data.flowWork.code;
-    }
-
-    // 获取流程的Form视图
-    getFlowFormView() {
-        const view = this.props.view;
-        if (typeof view === 'object') {
-            const nodeView = this.data.flowNode.view;
-            return (view as FlowFormView)[nodeView];
-        }
-        return view;
-    }
-
-
-    // 获取节点的数据
-    getNode = (code: string) => {
-        if (this.data) {
-            const nodes = this.data.flowWork.nodes;
-            for (const node of nodes) {
-                if (node.code === code) {
-                    return node;
-                }
-            }
-        }
-        return null;
-    }
-
-    // 获取当前的节点信息
-    getCurrentNode=()=>{
-        const currentNodeCode = this.getNodeCode();
-        return this.getNode(currentNodeCode);
-    }
-
-    // 获取当前节点的表单数据 （内部使用）
-    private getNodeState = (code: string) => {
-        const historyRecords = this.data.historyRecords || [];
-        if (code==='over' && this.isFinished()) {
-            return "done";
-        }
-        for (const record of historyRecords) {
-            if (record.nodeCode === code) {
-                if (record.flowType === 'TODO') {
-                    return "current";
-                }
-                return "done";
-            }
-        }
-        if(this.isFinished()){
-            return "undone";
-        }
-        return "wait";
-    }
-
-
-    // 获取历史记录
-    getHistoryRecords = () => {
-        return this.data.historyRecords;
-    }
-
-    // 获取当前的详情的记录数据
-    getCurrentFlowRecord = () => {
-        return this.data.flowRecord;
-    }
-
-    // 获取当前节点的流程图
-    getFlowSchema = () => {
-        if (this.data.flowWork.schema) {
-            const schema = JSON.parse(this.data.flowWork.schema);
-
-            for (const node of schema.nodes) {
-                node.properties.settingVisible = false;
-                node.properties.state = this.getNodeState(node.properties.code);
-            }
-            return schema;
-        }
-        return null;
-    }
-
-    // 获取审批意见
-    getOpinionAdvice = () => {
-        if(this.data.flowRecord){
-            if(this.data.flowRecord.opinion){
-                return this.data.flowRecord.opinion.advice;
-            }
-        }
-        return null;
-    }
-
-    // 获取历史审批意见
-    getHistoryOpinions() {
-        if(this.data.opinions){
-            return this.data.opinions.filter((item:any)=>{
-                if(!item.opinion){
-                    return false;
-                }
-                return item.opinion.result!==0;
-            });
-        }
-        return [];
-    }
-
-    //获取流程的form数据
-    getFlowFormParams() {
-        return {
-            ...this.data.bindData,
-            ...this.props.formParams
-        }
-    }
-
-    // 获取流程的操作按钮
-    getFlowButtons() {
-        const buttons = this.data.flowNode.buttons as FlowButton[] || [];
-        return buttons.sort((item1: any, item2: any) => {
-            return item1.order - item2.order;
-        })
-    }
-
-
-    // 是否可以审批
-    isApproval = () => {
-        return this.data.canHandle;
-    }
-
-    // 是否是开始节点
-    isStartNode = ()=>{
-        if (this.data) {
-            return this.data.flowNode.startNode;
-        }
-        return false;
-    }
-
-    // 获取当前节点的code
-    getNodeCode = () => {
-        if (this.data) {
-            return this.data.flowNode.code;
-        }
-        return null;
-    }
-
-    // 获取当前节点是否可编辑
-    isEditable = () => {
-        if(this.isFinished()){
-            return false;
-        }
-        if(this.isDone()){
-            return false;
-        }
-        return this.getFlowNodeEditable()
-    }
-
-    // 获取当前节点是否可编辑
-    getFlowNodeEditable = () => {
-        if (this.data) {
-            const node = this.data.flowNode;
-            if (node) {
-                return node.editable;
-            }
-        }
-        return false
-    }
-
-    // 是否已审批
-    isDone() {
-        if (this.data.flowRecord) {
-            return this.data.flowRecord.flowStatus === 'FINISH' || this.data.flowRecord.flowType === 'DONE';
-        }
-        return false;
-    }
-
-
-    // 是否完成
-    isFinished() {
-        if (this.data.flowRecord) {
-            return this.data.flowRecord.flowStatus === 'FINISH';
-        }
-        return false;
-    }
-
-
-    // 是否是退回状态
-    isReject(){
-        const historyRecords = this.data.historyRecords || [];
-        const currentRecord = this.data.flowRecord;
-        if(currentRecord && historyRecords.length>0){
-            const preId = currentRecord.preId;
-            const preRecord = historyRecords.find((item:any)=>item.id===preId);
-            if(preRecord){
-                return preRecord.flowSourceDirection === 'REJECT';
-            }
-        }
-        return false;
-    }
-
-}
diff --git a/mobile-ui/src/components/flow/domain/FlowResultParser.ts b/mobile-ui/src/components/flow/domain/FlowResultParser.ts
deleted file mode 100644
index 686e7c67..00000000
--- a/mobile-ui/src/components/flow/domain/FlowResultParser.ts
+++ /dev/null
@@ -1,92 +0,0 @@
-import {FlowResultMessage} from "@/components/flow/types";
-
-export class FlowWorkData {
-
-    protected readonly data: any;
-
-    constructor(data: any) {
-        this.data = data;
-    }
-
-    getNode = (code: string) => {
-        if (this.data) {
-            const nodes = this.data.flowWork.nodes;
-            for (const node of nodes) {
-                if (node.code === code) {
-                    return node;
-                }
-            }
-        }
-        return null;
-    }
-
-    getWorkCode() {
-        return this.data.flowWork.code;
-    }
-}
-
-
-export class FlowSubmitResultParser extends FlowWorkData {
-
-    constructor(data: any) {
-        super(data);
-    }
-
-    parser() {
-        const records = this.data.records;
-        const resultItems = [];
-        for (const record of records) {
-            const node = this.getNode(record.nodeCode);
-            resultItems.push({
-                label: '下级审批节点',
-                value: node.name
-            });
-
-            resultItems.push({
-                label: '下级审批人',
-                value: record.currentOperator.name
-            });
-        }
-        return {
-            title: '流程审批完成',
-            closeable: true,
-            state: 'success',
-            items: resultItems
-        } as FlowResultMessage;
-    }
-}
-
-
-export class FlowTrySubmitResultParser {
-
-    private readonly data: any;
-
-    constructor(data: any) {
-        this.data = data;
-    }
-
-    parser() {
-        const operators = this.data.operators;
-        const usernames = operators.map((item: any) => {
-            return item.name;
-        });
-        const flowResult = {
-            title: '下级节点提示',
-            closeable: false,
-            state: 'success',
-            items: [
-                {
-                    label: '下级审批节点',
-                    value: this.data.flowNode.name
-                },
-                {
-                    label: '下级审批人',
-                    value: usernames.join(',')
-                }
-            ]
-        }
-
-        return flowResult as FlowResultMessage;
-    }
-
-}
diff --git a/mobile-ui/src/components/flow/domain/FlowStateContext.tsx b/mobile-ui/src/components/flow/domain/FlowStateContext.tsx
deleted file mode 100644
index 5f2368c7..00000000
--- a/mobile-ui/src/components/flow/domain/FlowStateContext.tsx
+++ /dev/null
@@ -1,95 +0,0 @@
-import {FlowStore, UserSelectMode} from "@/components/flow/store/FlowSlice";
-import {FlowResultMessage} from "@/components/flow/types";
-
-/**
- * 流程的状态数据上下文对象
- */
-export class FlowStateContext {
-
-    private currentState: FlowStore;
-    private readonly updateFlowStore: (currentState: any) => any;
-
-    constructor(currentState: FlowStore, updateFlowStore: (state: any) => any) {
-        this.currentState = JSON.parse(JSON.stringify(currentState));
-        this.updateFlowStore = updateFlowStore;
-    }
-
-    private updateState() {
-        this.updateFlowStore({
-            ...this.currentState
-        })
-    }
-
-    setRequestLoading = (requestLoading: boolean) => {
-        this.currentState = {
-            ...this.currentState,
-            requestLoading
-        }
-        this.updateState();
-    }
-
-    setRecordId = (recordId: string) => {
-        this.currentState = {
-            ...this.currentState,
-            recordId
-        }
-        this.updateState();
-    }
-
-    setResult = (result: FlowResultMessage) => {
-        this.currentState = {
-            ...this.currentState,
-            result
-        }
-        this.updateState();
-    }
-
-    clearResult = () => {
-        this.currentState = {
-            ...this.currentState,
-            result: null
-        }
-        this.updateState();
-    }
-
-    hasRecordId = () => {
-        return this.currentState.recordId;
-    }
-
-    getRecordId = () => {
-        return this.currentState.recordId;
-    }
-
-    setPostponedVisible(visible: boolean) {
-        this.currentState = {
-            ...this.currentState,
-            postponedVisible: visible
-        }
-        this.updateState();
-    }
-
-    setUserSelectVisible(visible: boolean) {
-        this.currentState = {
-            ...this.currentState,
-            userSelectVisible: visible
-        }
-        this.updateState();
-    }
-
-    setUserSelectMode(userSelectMode: UserSelectMode) {
-        this.currentState = {
-            ...this.currentState,
-            userSelectVisible: true,
-            userSelectMode: userSelectMode
-        }
-        this.updateState();
-    }
-
-    randomVersion() {
-        this.currentState = {
-            ...this.currentState,
-            version: Math.random()
-        }
-        this.updateState();
-    }
-}
diff --git a/mobile-ui/src/components/flow/domain/FlowTriggerContext.ts b/mobile-ui/src/components/flow/domain/FlowTriggerContext.ts
deleted file mode 100644
index 7e673682..00000000
--- a/mobile-ui/src/components/flow/domain/FlowTriggerContext.ts
+++ /dev/null
@@ -1,32 +0,0 @@
-export interface EventTrigger {
-    trigger: (eventKey: string) => void
-}
-
-// 流程事件触发器上下文对象
-export class FlowTriggerContext {
-
-    private list: EventTrigger[] = [];
-
-    constructor() {
-    }
-
-    // 添加触发器
-    addTrigger(trigger:(eventKey:string)=>void) {
-        this.list.push({
-            trigger
-        });
-    }
-
-    // 触发事件
-    triggerEvent(eventKey: string) {
-        this.list.forEach(trigger => {
-            trigger.trigger(eventKey);
-        })
-    }
-
-    clear() {
-        this.list = [];
-    }
-
-}
-
diff --git a/mobile-ui/src/components/flow/nodes/Circulate/index.scss b/mobile-ui/src/components/flow/nodes/Circulate/index.scss
deleted file mode 100644
index 0e6b78fd..00000000
--- a/mobile-ui/src/components/flow/nodes/Circulate/index.scss
+++ /dev/null
@@ -1,49 +0,0 @@
-
-$color: #61aa1f;
-
-.circulate-node {
-  display: flex;
-  align-items: center;
-  max-height: 40px;
-  border: 1px solid $color;
-  border-radius: 12px;
-  padding: 10px;
-  position: relative;
-
-  .icon {
-    margin-left: 10px;
-    position: absolute;
-    color: $color;
-    font-size: 16px;
-    left: 0;
-  }
-
-  .code {
-    margin-left: 20px;
-    font-size: 14px;
-    color: #4a5e63;
-  }
-
-  .title {
-    margin-left: 5px;
-    font-size: 14px;
-    color: black;
-  }
-
-
-  .setting {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    color: $color;
-    right: 0;
-  }
-
-
-  .state {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    right: 0;
-  }
-}
diff --git a/mobile-ui/src/components/flow/nodes/Circulate/index.tsx b/mobile-ui/src/components/flow/nodes/Circulate/index.tsx
deleted file mode 100644
index ed4e8ed9..00000000
--- a/mobile-ui/src/components/flow/nodes/Circulate/index.tsx
+++ /dev/null
@@ -1,131 +0,0 @@
-import {HtmlNode, HtmlNodeModel} from '@logicflow/core';
-import React from "react";
-import ReactDOM from "react-dom/client";
-import "./index.scss";
-import {NodeState} from "@/components/flow/nodes/states";
-import StateLabel from "@/components/flow/nodes/StateLabel";
-import {PlayOutline, SetOutline} from "antd-mobile-icons";
-
-type CirculateProperties = {
-    id: string;
-    name: string;
-    code: string;
-    type: string;
-    view: string;
-    operatorMatcher: string;
-    editable: boolean;
-    titleGenerator: string;
-    errTrigger: string;
-    approvalType: string;
-    timeout: number;
-    settingVisible?: boolean;
-    state?: NodeState;
-}
-
-interface CirculateProps {
-    name: string;
-    code?: string;
-    update?: (values: any) => void;
-    settingVisible?: boolean;
-    properties?: CirculateProperties;
-}
-
-export const CirculateView: React.FC<CirculateProps> = (props) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const state = props.properties?.state;
-
-    return (
-        <div className="circulate-node">
-            <PlayOutline
-                className={"icon"}
-            />
-            <div>
-                <span className={"code"}>
-                    {props.code && (
-                        <>({props.code})</>
-                    )}
-                </span>
-                <span className={"title"}>{props.name}</span>
-            </div>
-
-            {props.settingVisible && (
-                <SetOutline
-                    className={"setting"}
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-
-            {state && (
-                <div className={"state"}>
-                    <StateLabel
-                        state={state}/>
-                </div>
-            )}
-        </div>
-    );
-}
-
-class CirculateModel extends HtmlNodeModel {
-    setAttributes() {
-        const name = this.properties.name as string;
-        this.width = 200 + name.length * 10;
-        this.height = 45;
-        this.text.editable = false;
-        this.menu = [];
-
-        this.sourceRules = [
-            {
-                message: `不允许输出`,
-                validate: (sourceNode: any, targetNode: any, sourceAnchor, targetAnchor) => {
-                    const edges = this.graphModel.getNodeOutgoingEdge(sourceNode.id);
-                    if (edges.length >= 1) {
-                        return false;
-                    } else {
-                        return true;
-                    }
-                },
-            },
-        ];
-
-        this.anchorsOffset = [
-            [this.width / 2, 0],
-            [0, this.height / 2],
-            [-this.width / 2, 0],
-            [0, -this.height / 2],
-        ];
-    }
-
-
-}
-
-class CirculateNode extends HtmlNode {
-    setHtml(rootEl: SVGForeignObjectElement) {
-        const {properties} = this.props.model as HtmlNodeModel<CirculateProperties>;
-        const div = document.createElement('div');
-        const settingVisible = properties.settingVisible !== false;
-        ReactDOM.createRoot(div).render(
-            <CirculateView
-                name={properties.name}
-                code={properties.code}
-                properties={properties}
-                settingVisible={settingVisible}
-                update={async (values) => {
-                    this.props.model.setProperties(values);
-                }}/>,
-        );
-        //需要清空
-        rootEl.innerHTML = '';
-        rootEl.appendChild(div);
-        super.setHtml(rootEl);
-    }
-}
-
-export default {
-    type: 'circulate-node',
-    view: CirculateNode,
-    model: CirculateModel,
-};
-
diff --git a/mobile-ui/src/components/flow/nodes/Node/index.scss b/mobile-ui/src/components/flow/nodes/Node/index.scss
deleted file mode 100644
index 58b6ecb5..00000000
--- a/mobile-ui/src/components/flow/nodes/Node/index.scss
+++ /dev/null
@@ -1,49 +0,0 @@
-
-$color: #6855ef;
-
-.node-node {
-  display: flex;
-  align-items: center;
-  max-height: 40px;
-  border: 1px solid $color;
-  border-radius: 12px;
-  padding: 10px;
-  position: relative;
-
-  .icon {
-    margin-left: 10px;
-    position: absolute;
-    color: $color;
-    font-size: 16px;
-    left: 0;
-  }
-
-  .code {
-    margin-left: 20px;
-    font-size: 14px;
-    color: #4a5e63;
-  }
-
-  .title {
-    margin-left: 5px;
-    font-size: 14px;
-    color: black;
-  }
-
-
-  .setting {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    color: $color;
-    right: 0;
-  }
-
-  .state {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    right: 0;
-  }
-
-}
diff --git a/mobile-ui/src/components/flow/nodes/Node/index.tsx b/mobile-ui/src/components/flow/nodes/Node/index.tsx
deleted file mode 100644
index fe45b1fe..00000000
--- a/mobile-ui/src/components/flow/nodes/Node/index.tsx
+++ /dev/null
@@ -1,121 +0,0 @@
-import {HtmlNode, HtmlNodeModel} from '@logicflow/core';
-import React from "react";
-import ReactDOM from "react-dom/client";
-import "./index.scss";
-import {NodeState} from "@/components/flow/nodes/states";
-import StateLabel from "@/components/flow/nodes/StateLabel";
-import {PlayOutline, SetOutline} from "antd-mobile-icons";
-
-type NodeProperties = {
-    id: string;
-    name: string;
-    code: string;
-    type: string;
-    view: string;
-    operatorMatcher: string;
-    editable: boolean;
-    titleGenerator: string;
-    errTrigger: string;
-    approvalType: string;
-    timeout: number;
-    settingVisible?: boolean;
-    state?: NodeState;
-}
-
-interface NodeProps {
-    name: string;
-    code?: string;
-    update?: (values: any) => void;
-    settingVisible?: boolean;
-    properties?: NodeProperties;
-    state?: NodeState;
-}
-
-export const NodeView: React.FC<NodeProps> = (props) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const state = props.properties?.state;
-
-    return (
-        <div className="node-node">
-            <PlayOutline
-                className={"icon"}
-            />
-            <div>
-                <span className={"code"}>
-                    {props.code && (
-                        <>({props.code})</>
-                    )}
-                </span>
-                <span className={"title"}>{props.name}</span>
-            </div>
-
-            {props.settingVisible && (
-                <SetOutline
-                    className={"setting"}
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-
-            {state && (
-                <div className={"state"}>
-                    <StateLabel
-                        state={state}/>
-                </div>
-            )}
-
-        </div>
-    );
-}
-
-class NodeModel extends HtmlNodeModel {
-    setAttributes() {
-        const name = this.properties.name as string;
-        this.width = 200 + name.length * 10;
-        this.height = 45;
-        this.text.editable = false;
-        this.menu = [];
-
-        this.anchorsOffset = [
-            [this.width / 2, 0],
-            [0, this.height / 2],
-            [-this.width / 2, 0],
-            [0, -this.height / 2],
-        ];
-    }
-
-
-}
-
-class NodeNode extends HtmlNode {
-    setHtml(rootEl: SVGForeignObjectElement) {
-        const {properties} = this.props.model as HtmlNodeModel<NodeProperties>;
-        const div = document.createElement('div');
-
-        const settingVisible = properties.settingVisible !== false;
-
-        ReactDOM.createRoot(div).render(
-            <NodeView
-                name={properties.name}
-                code={properties.code}
-                properties={properties}
-                settingVisible={settingVisible}
-                update={async (values) => {
-                    this.props.model.setProperties(values);
-                }}/>,
-        );
-        //需要清空
-        rootEl.innerHTML = '';
-        rootEl.appendChild(div);
-        super.setHtml(rootEl);
-    }
-}
-
-export default {
-    type: 'node-node',
-    view: NodeNode,
-    model: NodeModel,
-};
-
diff --git a/mobile-ui/src/components/flow/nodes/Over/index.scss b/mobile-ui/src/components/flow/nodes/Over/index.scss
deleted file mode 100644
index 771c830f..00000000
--- a/mobile-ui/src/components/flow/nodes/Over/index.scss
+++ /dev/null
@@ -1,49 +0,0 @@
-
-$color: #ea3f21;
-
-.over-node {
-  display: flex;
-  align-items: center;
-  max-height: 40px;
-  border: 1px solid $color;
-  border-radius: 12px;
-  padding: 10px;
-  position: relative;
-
-  .icon {
-    margin-left: 10px;
-    position: absolute;
-    color: $color;
-    font-size: 16px;
-    left: 0;
-  }
-
-  .code {
-    margin-left: 20px;
-    font-size: 14px;
-    color: #4a5e63;
-  }
-
-  .title {
-    margin-left: 5px;
-    font-size: 14px;
-    color: black;
-  }
-
-
-  .setting {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    color: $color;
-    right: 0;
-  }
-
-  .state {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    right: 0;
-  }
-
-}
diff --git a/mobile-ui/src/components/flow/nodes/Over/index.tsx b/mobile-ui/src/components/flow/nodes/Over/index.tsx
deleted file mode 100644
index 18158067..00000000
--- a/mobile-ui/src/components/flow/nodes/Over/index.tsx
+++ /dev/null
@@ -1,134 +0,0 @@
-import {HtmlNode, HtmlNodeModel} from '@logicflow/core';
-import React from "react";
-import ReactDOM from "react-dom/client";
-import "./index.scss";
-import {NodeState} from "@/components/flow/nodes/states";
-import StateLabel from "@/components/flow/nodes/StateLabel";
-import {PlayOutline, SetOutline} from "antd-mobile-icons";
-
-type OverProperties = {
-    id:string;
-    name: string;
-    code: string;
-    type:string;
-    view: string;
-    operatorMatcher:string;
-    editable:boolean;
-    titleGenerator:string;
-    errTrigger:string;
-    approvalType:string;
-    timeout:number;
-    settingVisible?: boolean;
-    state?: NodeState;
-}
-
-interface OverProps {
-    name: string;
-    code?: string;
-    update?: (values: any) => void;
-    settingVisible?: boolean;
-    properties?: OverProperties;
-}
-
-export const OverView: React.FC<OverProps> = (props) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const state = props.properties?.state;
-
-    return (
-        <div className="over-node">
-            <PlayOutline
-                className={"icon"}
-            />
-            <div>
-                <span className={"code"}>
-                    {props.code && (
-                        <>({props.code})</>
-                    )}
-                </span>
-                <span className={"title"}>{props.name}</span>
-            </div>
-            {props.settingVisible && (
-                <SetOutline
-                    className={"setting"}
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-
-            {state && (
-                <div className={"state"}>
-                    <StateLabel
-                        state={state}/>
-                </div>
-            )}
-
-        </div>
-    );
-}
-
-class OverModel extends HtmlNodeModel {
-
-    setAttributes() {
-        const name = this.properties.name as string;
-        this.width = 200 + name.length * 10;
-        this.height = 45;
-        this.text.editable = false;
-        this.menu = [];
-
-        this.sourceRules = [
-            {
-                message: `不允许输出`,
-                validate: (sourceNode, targetNode: any, sourceAnchor, targetAnchor) => {
-                    const edges = this.graphModel.getNodeIncomingEdge(targetNode.id);
-                    if (edges.length >= 0) {
-                        return false;
-                    } else {
-                        return true;
-                    }
-                },
-            },
-        ];
-
-        this.anchorsOffset = [
-            // [this.width / 2, 0],
-            // [0, this.height / 2],
-            // [-this.width / 2, 0],
-            [0, -this.height / 2],
-        ];
-    }
-
-
-}
-
-class OverNode extends HtmlNode {
-    setHtml(rootEl: SVGForeignObjectElement) {
-        const {properties} = this.props.model as HtmlNodeModel<OverProperties>;
-        const div = document.createElement('div');
-
-        const settingVisible = properties.settingVisible !== false;
-
-        ReactDOM.createRoot(div).render(
-            <OverView
-                name={properties.name}
-                code={properties.code}
-                properties={properties}
-                settingVisible={settingVisible}
-                update={async (values) => {
-                    this.props.model.setProperties(values);
-                }}/>,
-        );
-        //需要清空
-        rootEl.innerHTML = '';
-        rootEl.appendChild(div);
-        super.setHtml(rootEl);
-    }
-}
-
-export default {
-    type: 'over-node',
-    view: OverNode,
-    model: OverModel,
-};
-
diff --git a/mobile-ui/src/components/flow/nodes/Start/index.scss b/mobile-ui/src/components/flow/nodes/Start/index.scss
deleted file mode 100644
index 0b511a9d..00000000
--- a/mobile-ui/src/components/flow/nodes/Start/index.scss
+++ /dev/null
@@ -1,47 +0,0 @@
-$color: #b1ad30;
-
-.start-node {
-  display: flex;
-  align-items: center;
-  max-height: 40px;
-  border: 1px solid $color;
-  border-radius: 12px;
-  padding: 10px;
-  position: relative;
-
-  .icon {
-    margin-left: 10px;
-    position: absolute;
-    color: $color;
-    font-size: 16px;
-    left: 0;
-  }
-
-  .code {
-    margin-left: 20px;
-    font-size: 14px;
-    color: #4a5e63;
-  }
-
-  .title {
-    margin-left: 5px;
-    font-size: 14px;
-    color: black;
-  }
-
-  .setting {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    color: $color;
-    right: 0;
-  }
-
-  .state {
-    margin-right: 10px;
-    font-size: 14px;
-    position: absolute;
-    right: 0;
-  }
-
-}
diff --git a/mobile-ui/src/components/flow/nodes/Start/index.tsx b/mobile-ui/src/components/flow/nodes/Start/index.tsx
deleted file mode 100644
index 084440bd..00000000
--- a/mobile-ui/src/components/flow/nodes/Start/index.tsx
+++ /dev/null
@@ -1,118 +0,0 @@
-import {HtmlNode, HtmlNodeModel} from '@logicflow/core';
-import React from "react";
-import ReactDOM from "react-dom/client";
-import "./index.scss";
-import {NodeState} from "@/components/flow/nodes/states";
-import StateLabel from "@/components/flow/nodes/StateLabel";
-import {PlayOutline, SetOutline} from "antd-mobile-icons";
-
-type StartProperties = {
-    id: string;
-    name: string;
-    code: string;
-    type: string;
-    view: string;
-    operatorMatcher: string;
-    editable: boolean;
-    titleGenerator: string;
-    errTrigger: string;
-    approvalType: string;
-    timeout: number;
-    settingVisible?: boolean;
-    state?: NodeState;
-}
-
-interface StartProps {
-    name: string;
-    code?: string;
-    settingVisible?: boolean;
-    update?: (values: any) => void;
-    properties?: StartProperties;
-}
-
-export const StartView: React.FC<StartProps> = (props) => {
-    const [visible, setVisible] = React.useState(false);
-
-    const state = props.properties?.state;
-
-    return (
-        <div className="start-node">
-            <PlayOutline
-                className={"icon"}
-            />
-            <div>
-                <span className={"code"}>
-                    {props.code && (
-                        <>({props.code})</>
-                    )}
-                </span>
-                <span className={"title"}>{props.name}</span>
-            </div>
-            {props.settingVisible && (
-                <SetOutline
-                    className={"setting"}
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-
-            {state && (
-                <div className={"state"}>
-                    <StateLabel
-                        state={state}/>
-                </div>
-            )}
-
-        </div>
-    );
-}
-
-class StartModel extends HtmlNodeModel {
-    setAttributes() {
-        const name = this.properties.name as string;
-        this.width = 200 + name.length * 10;
-        this.height = 45;
-        this.text.editable = false;
-        this.menu = [];
-
-        this.anchorsOffset = [
-            // [this.width / 2, 0],
-            [0, this.height / 2],
-            // [-this.width / 2, 0],
-            // [0, -this.height / 2],
-        ];
-    }
-
-}
-
-class StartNode extends HtmlNode {
-    setHtml(rootEl: SVGForeignObjectElement) {
-        const {properties} = this.props.model as HtmlNodeModel<StartProperties>;
-        const div = document.createElement('div');
-
-        const settingVisible = properties.settingVisible !== false;
-
-        ReactDOM.createRoot(div).render(
-            <StartView
-                name={properties.name}
-                code={properties.code}
-                properties={properties}
-                settingVisible={settingVisible}
-                update={async (values) => {
-                    this.props.model.setProperties(values);
-                }}/>,
-        );
-        //需要清空
-        rootEl.innerHTML = '';
-        rootEl.appendChild(div);
-        super.setHtml(rootEl);
-    }
-}
-
-export default {
-    type: 'start-node',
-    view: StartNode,
-    model: StartModel,
-};
-
diff --git a/mobile-ui/src/components/flow/nodes/StateLabel.tsx b/mobile-ui/src/components/flow/nodes/StateLabel.tsx
deleted file mode 100644
index e2dc1006..00000000
--- a/mobile-ui/src/components/flow/nodes/StateLabel.tsx
+++ /dev/null
@@ -1,46 +0,0 @@
-import React from "react";
-import {NodeState} from "@/components/flow/nodes/states";
-import {Tag} from "antd-mobile";
-
-interface StateLabelProps {
-    state:NodeState;
-}
-
-const StateLabel:React.FC<StateLabelProps> = (props)=>{
-
-    const color = (state:NodeState) => {
-        switch (state) {
-            case "done":
-                return "success";
-            case "undone":
-                return "processing";
-            case "current":
-                return "warning";
-            default:
-                return "default";
-        }
-    }
-
-    const label = (state:NodeState) => {
-        switch (state) {
-            case "done":
-                return "已执行";
-            case "undone":
-                return "未执行";
-            case "current":
-                return "当前节点";
-            default:
-                return "待执行";
-        }
-    }
-
-    return (
-        <Tag
-            color={color(props.state)}
-        >
-            {label(props.state)}
-        </Tag>
-    )
-}
-
-export default StateLabel
diff --git a/mobile-ui/src/components/flow/nodes/states.ts b/mobile-ui/src/components/flow/nodes/states.ts
deleted file mode 100644
index b43944d0..00000000
--- a/mobile-ui/src/components/flow/nodes/states.ts
+++ /dev/null
@@ -1,2 +0,0 @@
-export type NodeState = "done" | "wait" | "undone" | "current";
-
diff --git a/mobile-ui/src/components/flow/register.tsx b/mobile-ui/src/components/flow/register.tsx
new file mode 100644
index 00000000..88ec70cb
--- /dev/null
+++ b/mobile-ui/src/components/flow/register.tsx
@@ -0,0 +1,66 @@
+import {PostponedFormViewKey} from "@codingapi/ui-framework";
+import {UserSelectFormViewKey} from "@codingapi/ui-framework";
+import {ComponentBus} from "@codingapi/ui-framework";
+import PostponedFormView from "@/components/flow/PostponedFormView";
+import UserSelectFormView from "@/components/flow/UserSelectFormView";
+import {FlowApi, FlowApiContent} from "@codingapi/flow-mobile";
+import * as flowApi from "@/api/flow";
+
+
+ComponentBus.getInstance().registerComponent(PostponedFormViewKey,PostponedFormView);
+ComponentBus.getInstance().registerComponent(UserSelectFormViewKey,UserSelectFormView);
+
+
+class DefaultFlowApiImpl implements FlowApi{
+
+    startFlow(body: any): Promise<any> {
+        return flowApi.startFlow(body);
+    }
+
+    submitFlow(body: any): Promise<any> {
+        return flowApi.submitFlow(body);
+    }
+
+    removeFlow(body: any): Promise<any> {
+        return flowApi.removeFlow(body);
+    }
+
+    saveFlow(body: any): Promise<any> {
+        return flowApi.saveFlow(body);
+    }
+
+    postponedFlow(body: any): Promise<any> {
+        return flowApi.postponed(body);
+    }
+
+    triggerCustomFlow(body: any): Promise<any> {
+        return flowApi.custom(body);
+    }
+
+    transferFlow(body: any): Promise<any> {
+        return flowApi.transfer(body);
+    }
+
+    urgeFlow(body: any): Promise<any> {
+        return flowApi.urge(body);
+    }
+
+    recallFlow(body: any): Promise<any> {
+        return flowApi.recall(body);
+    }
+
+    trySubmitFlow(body: any): Promise<any> {
+        return flowApi.trySubmitFlow(body);
+    }
+
+    getDetailById(id: string): Promise<any> {
+        return flowApi.detail(id,null);
+    }
+
+    getDetailByWorkCode(workCode: string): Promise<any> {
+        return flowApi.detail(null,workCode);
+    }
+
+}
+
+FlowApiContent.getInstance().registerFlowApi(new DefaultFlowApiImpl());
diff --git a/mobile-ui/src/components/flow/register/index.tsx b/mobile-ui/src/components/flow/register/index.tsx
deleted file mode 100644
index c629f6bd..00000000
--- a/mobile-ui/src/components/flow/register/index.tsx
+++ /dev/null
@@ -1,8 +0,0 @@
-import ComponentBus from "@/framework/ComponentBus";
-import {PostponedFormViewKey, UserSelectFormViewKey} from "@/components/flow/types";
-import PostponedFormView from "@/components/flow/plugins/PostponedFormView";
-import UserSelectFormView from "@/components/flow/plugins/UserSelectFormView";
-
-ComponentBus.getInstance().registerComponent(PostponedFormViewKey, PostponedFormView);
-ComponentBus.getInstance().registerComponent(UserSelectFormViewKey, UserSelectFormView);
-
diff --git a/mobile-ui/src/components/flow/store/FlowSlice.ts b/mobile-ui/src/components/flow/store/FlowSlice.ts
deleted file mode 100644
index ab1f5bdd..00000000
--- a/mobile-ui/src/components/flow/store/FlowSlice.ts
+++ /dev/null
@@ -1,124 +0,0 @@
-import {configureStore, createSlice, PayloadAction} from '@reduxjs/toolkit';
-import {FlowResultMessage, UserSelectFormType} from "@/components/flow/types";
-
-export interface FlowStore {
-    // 流程记录ID
-    recordId: string;
-    // 请求加载中
-    requestLoading: boolean;
-    // 流程结果
-    result: FlowResultMessage | null;
-    // 隐藏page的内容
-    contentHiddenVisible: boolean;
-    // 版本号
-    version: number;
-    // 数据版本号
-    dataVersion: number;
-
-    // 意见框展示状态
-    opinionVisible: boolean;
-
-    // 延期时间窗口状态
-    postponedVisible: boolean;
-    // 选人窗口状态
-    userSelectVisible: boolean;
-    // 选人状态
-    userSelectMode: UserSelectMode | null;
-}
-
-export interface UserSelectMode {
-    // 指定人员范围
-    specifyUserIds?: number[];
-    // 当前选择的人员
-    currentUserIds?: number[];
-    // 选人类型
-    userSelectType: UserSelectFormType;
-    // 是否多选
-    multiple: boolean;
-}
-
-export type FlowStoreAction = {
-    updateState: (state: FlowStore, action: PayloadAction<any>) => void;
-    initState: (state: FlowStore) => void;
-}
-
-export const flowSlice = createSlice<FlowStore, FlowStoreAction, "flow", {}>({
-    name: 'flow',
-    initialState: {
-        recordId: '',
-        requestLoading: false,
-        result: null,
-        contentHiddenVisible: false,
-        postponedVisible: false,
-        opinionVisible: true,
-        userSelectVisible: false,
-        userSelectMode: null,
-        version: 0,
-        dataVersion: 0,
-    },
-    reducers: {
-        updateState: (state, action) => {
-            const currentState = action.payload;
-            const keys = Object.keys(currentState);
-            if (keys.includes('requestLoading')) {
-                state.requestLoading = currentState.requestLoading;
-            }
-            if (keys.includes('recordId')) {
-                state.recordId = action.payload.recordId;
-            }
-            if (keys.includes('result')) {
-                state.result = action.payload.result;
-                state.contentHiddenVisible = state.result != null;
-            }
-            if (keys.includes('postponedVisible')) {
-                state.postponedVisible = action.payload.postponedVisible;
-            }
-
-            if (keys.includes('userSelectMode')) {
-                state.userSelectVisible = true;
-                state.userSelectMode = action.payload.userSelectMode;
-            }
-
-            if (keys.includes('version')) {
-                state.version = action.payload.version;
-            }
-
-            if (keys.includes('dataVersion')) {
-                state.dataVersion = action.payload.dataVersion;
-            }
-
-            if (keys.includes('userSelectVisible')) {
-                state.userSelectVisible = action.payload.userSelectVisible;
-                if (!state.userSelectVisible) {
-                    state.userSelectMode = null;
-                }
-            }
-        },
-        initState: (state) => {
-            state.recordId = '';
-            state.requestLoading = false;
-            state.result = null;
-            state.postponedVisible = false;
-            state.opinionVisible = true;
-            state.contentHiddenVisible = false;
-            state.userSelectVisible = false;
-            state.userSelectMode = null;
-            state.version = 0;
-            state.dataVersion = 0;
-        }
-    },
-});
-
-
-export const {
-    updateState,
-    initState
-} = flowSlice.actions;
-export const flowStore = configureStore({
-    reducer: {
-        flow: flowSlice.reducer
-    },
-});
-
-export type FlowReduxState = ReturnType<typeof flowStore.getState>;
-
diff --git a/mobile-ui/src/components/flow/types.ts b/mobile-ui/src/components/flow/types.ts
deleted file mode 100644
index 64d066a9..00000000
--- a/mobile-ui/src/components/flow/types.ts
+++ /dev/null
@@ -1,129 +0,0 @@
-import React from "react";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-
-// 流程图中线的类型
-export type EdgeType = 'line' | 'polyline' | 'bezier';
-
-// 延期表单视图Key
-export const PostponedFormViewKey = 'PostponedFormView';
-// 选人表单视图Key
-export const UserSelectFormViewKey = 'UserSelectFormViewKey';
-
-// 自定义按钮类型
-export type ButtonType =
-    'RELOAD'
-    | 'SAVE'
-    | 'START'
-    | 'SUBMIT'
-    | 'TRY_SUBMIT'
-    | 'SPECIFY_SUBMIT'
-    | 'REJECT'
-    | 'TRANSFER'
-    | 'RECALL'
-    | 'POSTPONED'
-    | 'URGE'
-    | 'CUSTOM'
-    | 'VIEW'
-    | 'REMOVE';
-
-// 流程自定义按钮
-export interface FlowButton {
-    id: string;
-    eventKey: string;
-    groovy: string;
-    name: string;
-    order: number;
-    style: any;
-    type: ButtonType;
-}
-
-// 延期表单 【拓展视图】
-export interface PostponedFormProps {
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    onFinish: (timeout: number) => void;
-}
-
-// 选人表单 【拓展视图】
-
-export type UserSelectFormType =
-// 选择下级流程节点的人员，约定人员id范围
-    'nextNodeUser'
-    // 选择转办人员，约定本单位下的人员
-    | 'transfer'
-    // 选择所有人员，在流程配置上使用
-    | 'users';
-
-export interface UserSelectFormProps {
-    visible: boolean;
-    setVisible: (visible: boolean) => void;
-    onFinish: (values: FlowUser[]) => void;
-    // 选择模式
-    multiple: boolean;
-    // 指定人员范围
-    specifyUserIds?: number[];
-    // 当前选择的人员
-    currentUserIds?: number[];
-    // 选人方式
-    userSelectType: UserSelectFormType;
-}
-
-
-// 结果展示数据项目
-export interface FlowResultItem {
-    label: string,
-    value: string
-}
-
-type FlowResultMessageState = 'success'|'info'|'warning';
-
-// 结果展示数据信息
-export interface FlowResultMessage {
-    title: string,
-    closeable: boolean,
-    state: FlowResultMessageState,
-    items?: FlowResultItem[]
-}
-
-// 流程用户
-export interface FlowUser {
-    id: string;
-    name: string;
-
-    [key: string]: any;
-}
-
-// 表单参数
-export interface FlowFormParams {
-    clazzName: string;
-
-    [key: string]: any;
-}
-
-// 流程表单数据
-export interface FlowFormViewProps {
-    // 表单数据
-    data: FlowFormParams;
-    // 表单控制对象
-    form: FormInstance;
-    // 数据版本
-    dataVersion?: number;
-}
-
-// 表单视图
-export interface FlowFormView {
-    [key: string]: React.ComponentType<FlowFormViewProps>;
-}
-
-export interface FlowViewProps {
-    // 流程编号
-    id?: string;
-    // 流程的设计编号
-    workCode?: string;
-    // 流程的视图数据
-    view: React.ComponentType<FlowFormViewProps> | FlowFormView;
-    // 表单参数，参数仅当在发起节点时才会传递
-    formParams?: FlowFormParams;
-}
-
diff --git a/mobile-ui/src/components/flow/view/index.scss b/mobile-ui/src/components/flow/view/index.scss
deleted file mode 100644
index 4c104da0..00000000
--- a/mobile-ui/src/components/flow/view/index.scss
+++ /dev/null
@@ -1,161 +0,0 @@
-@use "@/config/variables" as *;
-
-$flow-footer-height: 80px;
-
-.flow-skeleton-header {
-  width: 100%;
-  height: 40px;
-}
-
-.flow-skeleton-body {
-  height: 60vh;
-  width: 100%;
-}
-
-.flow-view {
-  background-color: white !important;
-  width: 100%;
-}
-
-.flow-view-content {
-  height: calc(100vh - $page-header-height - $flow-footer-height);
-  overflow: auto;
-}
-
-.flow-view-footer {
-  height: $flow-footer-height;
-  box-shadow: inset 0 1px 0 $body-background-color;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-
-  .flow-view-footer-button {
-    margin: 10px;
-    font-size: 14px;
-    padding: 8px 8px;
-    width: 100%;
-    border-color: $theme-primary-color;
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-  }
-}
-
-.flow-result-content {
-  padding: 10px;
-
-  .flow-result-content-item {
-    display: flex;
-    font-size: $content-font-size;
-    margin-top: 10px;
-
-    .flow-result-content-item-label {
-      flex: 1;
-      text-align: right;
-      margin: 5px;
-    }
-
-    .flow-result-content-item-value {
-      flex: 1;
-      text-align: left;
-      margin: 5px;
-    }
-  }
-
-  .flow-result-content-footer {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    margin-top: 20px;
-
-    .flow-result-content-button {
-      margin: 10px;
-      font-size: $content-font-size;
-      padding: 8px 8px;
-      width: 40%;
-      border-color: $theme-primary-color;
-    }
-  }
-}
-
-.flow-history-opinion-item {
-  padding: 5px;
-  font-size: $content-font-size;
-  border-bottom: 1px solid $body-background-color;
-
-  .flow-history-opinion-item-row {
-    margin-top: 10px;
-
-    span:first-child {
-      font-weight: bold;
-    }
-  }
-}
-
-.flow-history {
-  .flow-basic {
-
-  }
-
-  .flow-history-list {
-    margin-top: 10px;
-
-    .flow-history-list-item {
-      padding: 5px;
-      display: flex;
-      flex-direction: row;
-      margin-left: 10px;
-
-      .flow-history-list-item-line {
-        width: 30px;
-        height: 30px;
-        background-color: $theme-primary-color;
-        border-radius: 50%;
-        position: relative;
-      }
-
-      .flow-history-list-item-dot {
-        content: '';
-        position: absolute;
-        top: 33px;
-        left: 15px;
-        width: 1px;
-        height: calc(100% + 75px);
-        background-color: $theme-primary-color;
-        z-index: 0;
-      }
-
-      .flow-history-list-item-content {
-        display: flex;
-        flex-direction: column;
-        margin-left: 10px;
-        padding: 5px;
-
-        .flow-history-list-item-title {
-          font-size: $title-font-size;
-          font-weight: bold;
-        }
-
-        .flow-history-list-item-attr {
-          margin-top: 5px;
-          font-size: $content-font-size;
-        }
-      }
-    }
-  }
-}
-
-.flow-chart {
-  transition: 0.3s;
-  border-radius: 12px;
-
-  .flow-chart-content {
-    width: 0;
-    height: 0;
-  }
-
-  .flow-img {
-    width: 100%;
-    height: 100%;
-  }
-}
diff --git a/mobile-ui/src/components/flow/view/index.tsx b/mobile-ui/src/components/flow/view/index.tsx
deleted file mode 100644
index 2cdd5cf5..00000000
--- a/mobile-ui/src/components/flow/view/index.tsx
+++ /dev/null
@@ -1,107 +0,0 @@
-import React, {createContext, useEffect} from "react";
-import {Provider, useDispatch, useSelector} from "react-redux";
-import {FlowReduxState, flowStore, initState, updateState} from "@/components/flow/store/FlowSlice";
-import {FlowViewProps} from "@/components/flow/types";
-import {Skeleton} from "antd-mobile";
-import {FlowRecordContext} from "@/components/flow/domain/FlowRecordContext";
-import {FlowEventContext} from "@/components/flow/domain/FlowEventContext";
-import {detail} from "@/api/flow";
-import {FlowStateContext} from "@/components/flow/domain/FlowStateContext";
-import FlowPage from "@/components/flow/components/FlowPage";
-import {FlowTriggerContext} from "@/components/flow/domain/FlowTriggerContext";
-import {FlowButtonClickContext} from "@/components/flow/domain/FlowButtonClickContext";
-import "./index.scss";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-// 流程视图上下文属性
-interface FlowViewReactContextProps {
-    // 流程的详情控制上下文对象
-    flowRecordContext: FlowRecordContext;
-    // 流程的事件控制上下文对象
-    flowEventContext: FlowEventContext;
-    // 流程的状态数据上下文对象
-    flowStateContext: FlowStateContext;
-    // 流程事件触发控制上下文对象
-    flowTriggerContext: FlowTriggerContext;
-    // 流程按钮点击触发控制器上下文对象
-    flowButtonClickContext: FlowButtonClickContext;
-    // 表单操作对象
-    formInstance: FormInstance;
-    // 审批意见操作对象
-    opinionInstance: FormInstance;
-}
-
-export const FlowViewReactContext = createContext<FlowViewReactContextProps | null>(null);
-
-const $FlowView: React.FC<FlowViewProps> = (props) => {
-    const [data, setData] = React.useState<any>(null);
-
-    const dispatch = useDispatch();
-
-    const version = useSelector((state: FlowReduxState) => state.flow.version);
-
-    // 请求流程详情数据
-    const loadFlowDetail = () => {
-        if (props.id) {
-            detail(props.id, null).then(res => {
-                if (res.success) {
-                    setData(res.data);
-                }
-            });
-            return;
-        }
-        if (props.workCode) {
-            detail(null, props.workCode).then(res => {
-                if (res.success) {
-                    setData(res.data);
-                }
-            });
-            return;
-        }
-    }
-
-    useEffect(() => {
-        if(data){
-            const dataVersion = Math.random();
-            dispatch(updateState({dataVersion:dataVersion}));
-        }
-    }, [data]);
-
-    useEffect(() => {
-        return ()=>{
-            dispatch(initState());
-        }
-    }, []);
-
-    useEffect(() => {
-        loadFlowDetail();
-    }, [version]);
-
-
-    return (
-        <>
-            {!data && (
-                <>
-                    <Skeleton.Title animated={true} className={"flow-skeleton-header"}/>
-                    <Skeleton.Paragraph lineCount={5} animated={true} className={"flow-skeleton-body"}/>
-                </>
-            )}
-            {data && (
-                <FlowPage
-                    {...props}
-                    flowData={data}
-                />
-            )}
-        </>
-    )
-}
-
-const FlowView: React.FC<FlowViewProps> = (props) => {
-    return (
-        <Provider store={flowStore}>
-            <$FlowView  {...props} />
-        </Provider>
-    )
-}
-
-export default FlowView;
diff --git a/mobile-ui/src/components/form/captcha.tsx b/mobile-ui/src/components/form/captcha.tsx
deleted file mode 100644
index 1e0db267..00000000
--- a/mobile-ui/src/components/form/captcha.tsx
+++ /dev/null
@@ -1,57 +0,0 @@
-import React, {useEffect, useState} from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Input} from "antd-mobile";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormCaptcha: React.FC<FormItemProps> = (props) => {
-    const [captchaImg, setCaptchaImg] = useState<string>('');
-    const {formContext,rules} = formFieldInit(props);
-
-    const reloadCaptcha = () => {
-        props.onCaptchaRefresh && props.onCaptchaRefresh().then((res) => {
-            if(res) {
-                setCaptchaImg(res.url);
-                props.onCaptchaChange && props.onCaptchaChange(res.code);
-            }
-        });
-    }
-
-    useEffect(() => {
-        reloadCaptcha();
-    }, [])
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-            extra={(
-                <img
-                    onClick={() => {
-                        reloadCaptcha();
-                    }}
-                    style={{
-                        height: 40
-                    }}
-                    src={captchaImg}
-                    alt="点击重置"
-                />
-            )}
-        >
-            <Input
-                value={props.value}
-                placeholder={props.placeholder}
-                onChange={(value) => {
-                    formContext?.setFieldValue(props.name, value);
-                    props.onChange && props.onChange(value,formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormCaptcha;
diff --git a/mobile-ui/src/components/form/cascader.tsx b/mobile-ui/src/components/form/cascader.tsx
deleted file mode 100644
index 0840151c..00000000
--- a/mobile-ui/src/components/form/cascader.tsx
+++ /dev/null
@@ -1,113 +0,0 @@
-import React, {useEffect} from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Cascader, Form} from "antd-mobile";
-import {RightOutline} from "antd-mobile-icons";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const valueToForm = (value: string) => {
-    if (value && value.length > 0) {
-        return value.split(",");
-    }
-    return value;
-}
-
-const formToValue = (value: string[]) => {
-    if (value && value.length > 0) {
-        return value.join(",")
-    }
-    return value;
-}
-
-const FormCascader: React.FC<FormItemProps> = (props) => {
-
-
-    const [visible, setVisible] = React.useState(false);
-    const [options, setOptions] = React.useState(props.options);
-
-    const {formContext, rules} = formFieldInit(props, () => {
-        reloadOptions();
-    });
-
-    const reloadOptions = () => {
-        if (props.loadOptions) {
-            props.loadOptions(formContext).then(res => {
-                setOptions(res);
-            });
-        }
-    }
-
-    useEffect(() => {
-        reloadOptions();
-    }, []);
-
-    useEffect(() => {
-        if (visible) {
-            reloadOptions();
-        }
-    }, [visible]);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-            extra={(
-                <RightOutline
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-            getValueProps={(value) => {
-                if (value) {
-                    return {
-                        value: valueToForm(value)
-                    }
-                }
-                return value
-            }}
-        >
-            <Cascader
-                value={props.value}
-                options={options || []}
-                visible={visible}
-                onClose={() => {
-                    setVisible(false)
-                }}
-                onConfirm={(value) => {
-                    formContext?.setFieldValue(props.name as string, formToValue(value as string[]));
-                    props.onChange && props.onChange(value, formContext);
-                    setVisible(false);
-                }}
-            >
-                {items => {
-                    if (items.every(item => item === null)) {
-                        return (
-                            <span
-                                onClick={() => {
-                                    setVisible(true)
-                                }}
-                                className={"placeholder-span"}
-                            >{props.placeholder || '请选择数据'}</span>
-                        )
-                    } else {
-                        const value = items.map(item => item?.label ?? '请选择数据').join('-')
-                        return (
-                            <span
-                                onClick={() => {
-                                    setVisible(true)
-                                }}
-                            >{value}</span>
-                        )
-                    }
-                }}
-            </Cascader>
-        </Form.Item>
-    )
-}
-
-export default FormCascader;
diff --git a/mobile-ui/src/components/form/checkbox.tsx b/mobile-ui/src/components/form/checkbox.tsx
deleted file mode 100644
index 64437625..00000000
--- a/mobile-ui/src/components/form/checkbox.tsx
+++ /dev/null
@@ -1,79 +0,0 @@
-import React, {useEffect} from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Checkbox, Form, Space} from "antd-mobile";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const valueToForm = (value: string) => {
-    if (value && value.length > 0) {
-        return value.split(",");
-    }
-    return value;
-}
-
-const formToValue = (value: string[]) => {
-    if (value && value.length > 0) {
-        return value.join(",")
-    }
-    return value;
-}
-
-const FormCheckbox: React.FC<FormItemProps> = (props) => {
-    const [options, setOptions] = React.useState(props.options);
-
-    const {formContext, rules} = formFieldInit(props, () => {
-        reloadOptions();
-    });
-
-    const reloadOptions = () => {
-        if (props.loadOptions) {
-            props.loadOptions(formContext).then(res => {
-                setOptions(res);
-            });
-        }
-    }
-
-    useEffect(() => {
-        reloadOptions();
-    }, []);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-            getValueProps={(value) => {
-                if (value) {
-                    return {
-                        value: valueToForm(value)
-                    }
-                }
-                return value
-            }}
-        >
-            <Checkbox.Group
-                value={props.value}
-                onChange={(e) => {
-                    formContext?.setFieldValue(props.name, formToValue(e as string[]));
-                    props.onChange && props.onChange(e, formContext)
-                }}
-            >
-                <Space direction={props.checkboxDirection}>
-                    {options?.map(item => {
-                        return (
-                            <Checkbox
-                                disabled={item.disable}
-                                value={item.value}
-                            >{item.label}</Checkbox>
-                        )
-                    })}
-                </Space>
-            </Checkbox.Group>
-        </Form.Item>
-    )
-}
-
-export default FormCheckbox;
diff --git a/mobile-ui/src/components/form/common.tsx b/mobile-ui/src/components/form/common.tsx
deleted file mode 100644
index 6aa7bd0b..00000000
--- a/mobile-ui/src/components/form/common.tsx
+++ /dev/null
@@ -1,42 +0,0 @@
-import React, {useEffect} from "react";
-import {FormContext} from "@/components/form";
-import {FormItemProps} from "@/components/form/types";
-
-const formFieldInit = (props: FormItemProps,reloadOption?:()=>void) => {
-    const formContext = React.useContext(FormContext) || undefined;
-    const validateContext = formContext?.getFormValidateContext();
-    const [random, setRandom] = React.useState(0);
-
-    const rules= props.required?[{required: true}]:[];
-
-    useEffect(() => {
-        if (props.validateFunction) {
-            if (validateContext) {
-                if (props.disabled || props.hidden) {
-                    // do nothing
-                } else {
-                    validateContext.addValidateFunction(props.name, props.validateFunction);
-                }
-            }
-        }
-        const reloadContext = formContext?.getFormFieldReloadListenerContext();
-        if (reloadContext) {
-            reloadContext.addListener(props.name, () => {
-                setRandom(Math.random);
-            });
-        }
-
-        const optionContext = formContext?.getFormFieldOptionListenerContext();
-        if (optionContext) {
-            optionContext.addListener(props.name, () => {
-                if(reloadOption){
-                    reloadOption();
-                }
-            });
-        }
-    }, [formContext]);
-
-    return {formContext, validateContext, rules};
-}
-
-export default formFieldInit;
diff --git a/mobile-ui/src/components/form/date.tsx b/mobile-ui/src/components/form/date.tsx
deleted file mode 100644
index d326d3fc..00000000
--- a/mobile-ui/src/components/form/date.tsx
+++ /dev/null
@@ -1,102 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {DatePicker, Form} from "antd-mobile";
-import {RightOutline} from "antd-mobile-icons";
-import dayjs from "dayjs";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-export const dateLabelRenderer = (type: string, data: number) => {
-    switch (type) {
-        case 'year':
-            return data + '年'
-        case 'month':
-            return data + '月'
-        case 'day':
-            return data + '日'
-        case 'hour':
-            return data + '时'
-        case 'minute':
-            return data + '分'
-        case 'second':
-            return data + '秒'
-        default:
-            return data
-    }
-}
-
-const FormDate: React.FC<FormItemProps> = (props) => {
-
-    const {formContext, rules} = formFieldInit(props);
-
-    const format = props.dateFormat || 'YYYY-MM-DD';
-    const precision = props.datePrecision || "day";
-    const [visible, setVisible] = React.useState(false);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-            extra={(
-                <RightOutline
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-            getValueProps={(value) => {
-                if (value) {
-                    return {
-                        value: dayjs(value).toDate()
-                    }
-                }
-                return value;
-            }}
-        >
-            <DatePicker
-                title={props.label}
-                value={props.value}
-                visible={visible}
-                precision={precision}
-                renderLabel={dateLabelRenderer}
-                onClose={() => {
-                    setVisible(false)
-                }}
-                onConfirm={value => {
-                    const currentDate = dayjs(value).format(format);
-                    formContext?.setFieldValue(props.name as string, currentDate);
-                    props.onChange && props.onChange(currentDate, formContext);
-                    setVisible(false)
-                }}
-            >
-                {value => {
-                    if (value) {
-                        const currentValue = dayjs(value).format(format);
-                        return (
-                            <span
-                                onClick={() => {
-                                    setVisible(true)
-                                }}
-                            >{currentValue}</span>
-                        )
-                    }
-                    return (
-                        <span
-                            onClick={() => {
-                                setVisible(true)
-                            }}
-                            className={"placeholder-span"}
-                        >{props.placeholder || '请选择日期'}
-                        </span>
-                    )
-                }}
-            </DatePicker>
-        </Form.Item>
-    )
-}
-
-export default FormDate;
diff --git a/mobile-ui/src/components/form/domain/FormInstance.tsx b/mobile-ui/src/components/form/domain/FormInstance.tsx
deleted file mode 100644
index 7502c8f0..00000000
--- a/mobile-ui/src/components/form/domain/FormInstance.tsx
+++ /dev/null
@@ -1,314 +0,0 @@
-import {FormValidateContext} from "@/components/form/validate";
-import {FormFieldOptionListenerContext, FormFieldReloadListenerContext} from "@/components/form/listener";
-import {FormInstance as MobileFormInstance} from "rc-field-form/es/interface";
-import {FormField} from "@/components/form/types";
-import {NamePath} from "antd-mobile/es/components/form";
-import {Form as MobileForm} from "antd-mobile";
-import {FiledData, FormAction} from "@/components/form";
-import React from "react";
-
-class FormInstance {
-    private readonly validateContext: FormValidateContext;
-    private readonly reloadContext: FormFieldReloadListenerContext;
-    private readonly optionContext: FormFieldOptionListenerContext;
-    private readonly formInstance: MobileFormInstance;
-    private readonly formAction: FormAction;
-    private fields: FormField[];
-
-    private fieldsUpdateDispatch: React.Dispatch<React.SetStateAction<FormField[]>> | undefined;
-
-    public setFieldsUpdateDispatch = (fieldsUpdateDispatch: React.Dispatch<React.SetStateAction<FormField[]>>) => {
-        this.fieldsUpdateDispatch = fieldsUpdateDispatch;
-    }
-
-    private updateFields = (resetFields:(prevState: FormField[]) => FormField[]) => {
-        this.fields = resetFields(this.fields);
-        if (this.fieldsUpdateDispatch) {
-            this.fieldsUpdateDispatch(resetFields);
-        }
-    }
-
-    private namePathEqual = (name1: NamePath, name2: NamePath) => {
-        if (Array.isArray(name1) && Array.isArray(name2)) {
-            if (name1.length !== name2.length) {
-                return false;
-            }
-            for (let i = 0; i < name1.length; i++) {
-                if (name1[i] !== name2[i]) {
-                    return false;
-                }
-            }
-            return true;
-        }
-        return name1 === name2;
-    }
-
-    public submit = async () => {
-        const res = await this.validateContext.validate(this);
-        if (res) {
-            this.formInstance.submit();
-        }
-    }
-
-    public reset = (values?: any) => {
-        this.formInstance.resetFields();
-        if (values) {
-            this.formInstance.setFieldsValue(values);
-            this.reloadContext.notifyAll();
-        }
-    }
-
-    public hidden = (name: NamePath) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            if (this.namePathEqual(field.props.name, name)) {
-                return {
-                    ...field,
-                    props: {
-                        ...field.props,
-                        hidden: true,
-                        required: false
-                    }
-                }
-            }
-            return field;
-        }));
-        this.validateContext.clear();
-    }
-
-    public required = (name: NamePath, required: boolean) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            if (this.namePathEqual(field.props.name,name)) {
-                return {
-                    ...field,
-                    props: {
-                        ...field.props,
-                        required: required
-                    }
-                }
-            }
-            return field;
-        }));
-        this.validateContext.clear();
-    }
-
-    public show = (name: NamePath) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            if (this.namePathEqual(field.props.name,name)) {
-                return {
-                    ...field,
-                    props: {
-                        ...field.props,
-                        hidden: false
-                    }
-                }
-            }
-            return field;
-        }));
-        this.validateContext.clear();
-    }
-
-    public disable = (name: NamePath) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            if (this.namePathEqual(field.props.name,name)) {
-                return {
-                    ...field,
-                    props: {
-                        ...field.props,
-                        disabled: true
-                    }
-                }
-            }
-            return field;
-        }));
-        this.validateContext.clear();
-    }
-
-    public disableAll = () => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            return {
-                ...field,
-                props: {
-                    ...field.props,
-                    disabled: true
-                }
-            }
-        }));
-        this.validateContext.clear();
-    }
-
-    public enable = (name: NamePath) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            if (this.namePathEqual(field.props.name,name)) {
-                return {
-                    ...field,
-                    props: {
-                        ...field.props,
-                        disabled: false
-                    }
-                }
-            }
-            return field;
-        }));
-        this.validateContext.clear();
-    }
-
-    public enableAll = () => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.map((field) => {
-            return {
-                ...field,
-                props: {
-                    ...field.props,
-                    disabled: false
-                }
-            }
-        }));
-        this.validateContext.clear();
-    }
-
-    public remove = (name: NamePath) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => prevFields.filter((field) => !this.namePathEqual(field.props.name,name)));
-        this.validateContext.clear();
-    }
-
-    public create = (field: FormField, index?: number) => {
-        if (this.fields.length == 0) {
-            return;
-        }
-        this.updateFields(prevFields => {
-            const filteredFields = prevFields.filter((item) => item.props.name !== field.props.name);
-            if (index === undefined || index < 0) {
-                return [...filteredFields, field];
-            } else {
-                const newFields = [...filteredFields];
-                newFields.splice(index, 0, field);
-                return newFields;
-            }
-        });
-        this.validateContext.clear();
-    }
-
-    public getFieldValue = (name: NamePath) => {
-        return this.formInstance.getFieldValue(name);
-    }
-
-    public getFieldsValue = () => {
-        return this.formInstance.getFieldsValue();
-    }
-
-    public getFieldProps = (name: NamePath) => {
-        for (const field of this.fields) {
-            if (this.namePathEqual(field.props.name, name)) {
-                return field;
-            }
-        }
-        return null;
-    }
-
-    public reloadOptions = (name: NamePath) => {
-        this.optionContext.notify(name);
-    }
-
-    public reloadAllOptions = () => {
-        this.optionContext.notifyAll();
-    }
-
-    public setFieldValue = (name: NamePath, value: any) => {
-        this.formInstance.setFieldValue(name, value);
-        this.reloadContext.notify(name);
-        this.validateContext?.validateField(name, this);
-    }
-
-    public setFieldsValue = (values: any) => {
-        this.formInstance.setFieldsValue(values);
-        this.reloadContext.notifyAll();
-    }
-
-    public setFields = (fields: FiledData[]) => {
-        this.formInstance.setFields(fields);
-    }
-
-    public validate = () => {
-        return this.validateContext.validate(this);
-    }
-
-    public resetFields = (fields:FormField[]) => {
-        this.fields = fields;
-    }
-
-    constructor() {
-        this.validateContext = new FormValidateContext();
-        this.reloadContext = new FormFieldReloadListenerContext();
-        this.optionContext = new FormFieldOptionListenerContext();
-        this.formInstance = MobileForm.useForm()[0];
-        this.fields = [];
-        this.formAction = {
-            submit: this.submit,
-            reset: this.reset,
-            hidden: this.hidden,
-            show: this.show,
-            remove: this.remove,
-            create: this.create,
-            disable: this.disable,
-            disableAll: this.disableAll,
-            enable: this.enable,
-            enableAll: this.enableAll,
-            required: this.required,
-            getFieldValue: this.getFieldValue,
-            getFieldsValue: this.getFieldsValue,
-            getFieldProps: this.getFieldProps,
-            reloadOptions: this.reloadOptions,
-            reloadAllOptions: this.reloadAllOptions,
-            setFieldValue: this.setFieldValue,
-            setFieldsValue: this.setFieldsValue,
-            setFields: this.setFields,
-            validate: this.validate,
-        }
-    }
-
-    public getFormAction = () => {
-        return this.formAction;
-    }
-
-    public getFormValidateContext = () => {
-        return this.validateContext;
-    }
-
-    public getFormFieldReloadListenerContext = () => {
-        return this.reloadContext;
-    }
-
-    public getFormFieldOptionListenerContext = () => {
-        return this.optionContext;
-    }
-
-    public getFormControlInstance = ():MobileFormInstance => {
-        return this.formInstance;
-    }
-
-}
-
-export default FormInstance;
diff --git a/mobile-ui/src/components/form/factory.tsx b/mobile-ui/src/components/form/factory.tsx
deleted file mode 100644
index 1007193a..00000000
--- a/mobile-ui/src/components/form/factory.tsx
+++ /dev/null
@@ -1,163 +0,0 @@
-import React from "react";
-import {FormField} from "@/components/form/types";
-import FormInput from "@/components/form/input";
-import FormPassword from "@/components/form/password";
-import FormSelect from "@/components/form/select";
-import FormDate from "@/components/form/date";
-import FormRadio from "@/components/form/radio";
-import FormTextArea from "@/components/form/textarea";
-import FormCascader from "@/components/form/cascader";
-import FormCheckbox from "@/components/form/checkbox";
-import FormUploader from "@/components/form/uploder";
-import FormSwitch from "@/components/form/switch";
-import FormStepper from "@/components/form/stepper";
-import FormSlider from "@/components/form/slider";
-import FormRate from "@/components/form/rate";
-import FormSelector from "@/components/form/selector";
-import FormCaptcha from "@/components/form/captcha";
-
-class FormFactory {
-
-    static create = (field: FormField) => {
-        const type = field.type;
-        const props = field.props;
-
-        if (type === 'input') {
-            return (
-                <FormInput
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'captcha') {
-            return (
-                <FormCaptcha
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'password') {
-            return (
-                <FormPassword
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'cascader') {
-            return (
-                <FormCascader
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'select') {
-            return (
-                <FormSelect
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'date') {
-            return (
-                <FormDate
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'radio') {
-            return (
-                <FormRadio
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'checkbox') {
-            return (
-                <FormCheckbox
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'textarea') {
-            return (
-                <FormTextArea
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'uploader') {
-            return (
-                <FormUploader
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'switch') {
-            return (
-                <FormSwitch
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'stepper') {
-            return (
-                <FormStepper
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'slider') {
-            return (
-                <FormSlider
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'rate') {
-            return (
-                <FormRate
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-
-        if (type === 'selector') {
-            return (
-                <FormSelector
-                    {...props}
-                    key={props.name}
-                />
-            )
-        }
-    }
-
-}
-
-export default FormFactory;
diff --git a/mobile-ui/src/components/form/form.scss b/mobile-ui/src/components/form/form.scss
deleted file mode 100644
index 3e306233..00000000
--- a/mobile-ui/src/components/form/form.scss
+++ /dev/null
@@ -1,145 +0,0 @@
-@use "../../config/variables" as *;
-
-.placeholder-span {
-  color: $from-placeholder-color;
-}
-
-.form-uploader-file {
-  height: 90px;
-  width: 90px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  flex-wrap: wrap; /* 允许子元素换行 */
-  text-align: center; /* 水平居中 */
-  word-wrap: break-word; /* 超出容器时换行 */
-  border: 0.5px solid $body-background-color;
-  position: relative;
-
-  .delete-icon {
-    margin-top: -5px;
-    margin-right: -5px;
-    position: absolute;
-    right: 0;
-    top: 0;
-    width: 15px;
-    height: 15px;
-  }
-
-  a {
-    width: 100%;
-    font-size: 12px;
-  }
-}
-
-.form-password {
-  display: flex;
-
-  .form-password-eye {
-    flex: none;
-    margin-left: 8px;
-    padding: 4px;
-    cursor: pointer;
-
-    svg {
-      display: block;
-    }
-  }
-}
-
-
-.select-popup {
-  padding: 12px;
-  width: 100%;
-
-  .select-popup-content {
-    height: 45vh;
-    padding: 15px;
-    width: 100%;
-    overflow-y: scroll;
-
-    .checkbox-parent {
-      cursor: pointer;
-      display: flex;
-      justify-content: space-between;
-    }
-
-
-    .select-popup-content-custom-form {
-
-
-      .select-popup-content-custom-footer {
-        display: flex;
-        justify-content: space-between;
-        align-items: center;
-        margin: 30px;
-
-        button{
-          width: 300px;
-          margin: 10px;
-        }
-      }
-
-    }
-
-  }
-
-  .select-popup-header {
-    height: 30px;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    padding: 5px;
-
-    a {
-      font-weight: bold;
-    }
-  }
-
-  .select-popup-navbar {
-    padding: 10px 5px 0 10px;
-    height: 20px;
-    overflow-x: auto;
-    white-space: nowrap;
-    width: 100vw;
-    display: flex;
-
-    .select-popup-navbar-item {
-      height: 20px;
-      align-items: center;
-
-      .arrow {
-        color: $theme-primary-color;
-      }
-
-      .span {
-        margin-left: 10px;
-        color: $theme-primary-color;
-      }
-    }
-  }
-
-  .select-popup-navbar::-webkit-scrollbar {
-    display: none;
-  }
-
-  .select-popup-search {
-    height: 30px;
-    padding: 5px;
-    display: flex;
-    align-items: center;
-
-    .select-popup-search-bar {
-      flex: 9;
-      height: 30px;
-    }
-
-    .select-popup-search-button {
-      flex: 1;
-      height: 20px;
-    }
-  }
-
-}
-
-
diff --git a/mobile-ui/src/components/form/index.tsx b/mobile-ui/src/components/form/index.tsx
deleted file mode 100644
index 59dec584..00000000
--- a/mobile-ui/src/components/form/index.tsx
+++ /dev/null
@@ -1,135 +0,0 @@
-import React, {useEffect} from "react";
-import {Form as MobileForm} from "antd-mobile";
-import FormFactory from "@/components/form/factory";
-import {FormField} from "@/components/form/types";
-import {NamePath} from "antd-mobile/es/components/form";
-import "./form.scss";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-export interface FiledData {
-    name: NamePath;
-    errors?: string[];
-}
-
-export interface FormAction {
-    // 提交表单，提取之前会先校验表单
-    submit: () => void;
-    // 重置表单，恢复表单项最初的状态
-    reset: (values?: any) => void;
-    // 隐藏表单项，隐藏后的表单项不会显示在表单中，但是值会被提交
-    hidden: (name: NamePath) => void;
-    // 展示表单项，展示后的表单项会显示在表单中，值也会被提交
-    show: (name: NamePath) => void;
-    // 删除表单项，删除后的表单项不会显示在表单中，值也不会被提交，在fields配置的情况下生效
-    remove: (name: NamePath) => void;
-    // 添加表单项，添加后的表单项会显示在表单中，值也会被提交，在fields配置的情况下生效
-    create: (field: FormField, index?: number) => void;
-    // 禁用表单项，禁用后的表单项还会被提交
-    disable: (name: NamePath) => void;
-    // 全部禁用，禁用后的表单项还会被提交
-    disableAll:()=>void;
-    // 启用表单项，启用后的表单项还会被提交
-    enable: (name: NamePath) => void;
-    // 全部启用，启用后的表单项还会被提交
-    enableAll:()=>void;
-    // 必填选项控制,true为必填false为非必填提示
-    required: (name: NamePath,required:boolean) => void;
-    // 获取字段的值
-    getFieldValue: (name: NamePath) => any;
-    // 重新加载选项
-    reloadOptions: (name: NamePath) => any;
-    // 重新加载所有选项
-    reloadAllOptions: () => any;
-    // 获取全部字段的值
-    getFieldsValue: () => any;
-    // 设置字段的值
-    setFieldValue: (name: NamePath, value: any) => void;
-    // 设置全部字段的值
-    setFieldsValue: (values: any) => void;
-    // 设置Field字段
-    setFields: (fields: FiledData[]) => void;
-    // 获取Field属性
-    getFieldProps: (name: NamePath) => FormField | null;
-    // 校验表单
-    validate: () => Promise<boolean>;
-}
-
-export interface FormProps {
-    // 表单字段
-    loadFields?: ()=>Promise<FormField[]>;
-    // 表单提交事件
-    onFinish?: (values: any) => Promise<void>;
-    // form布局，默认vertical
-    layout?: 'horizontal' | 'vertical';
-    // children元素
-    children?: React.ReactNode;
-    // footer元素
-    footer?: React.ReactNode;
-    // 初始化值
-    initialValues?: any;
-    // 表单实例
-    form?: FormInstance;
-}
-
-
-export const FormContext = React.createContext<FormInstance | null>(null);
-
-const FormComponent: React.FC<FormProps> = (props) => {
-
-    const formInstance = props.form? props.form : new FormInstance();
-
-    const [fields, setFields] = React.useState<FormField[]>([]);
-    formInstance.setFieldsUpdateDispatch(setFields);
-
-    const formControl = formInstance.getFormControlInstance() ;
-
-    const reloadFields = ()=>{
-        if(props.loadFields){
-            props.loadFields().then(fields=>{
-                setFields(fields);
-                formInstance.resetFields(fields);
-            })
-        }
-    }
-
-    useEffect(() => {
-        reloadFields();
-    }, [props.loadFields]);
-
-
-    return (
-        <FormContext.Provider
-            value={formInstance}
-        >
-            <MobileForm
-                form={formControl}
-                onFinish={(values) => {
-                    props.onFinish && props.onFinish(values);
-                }}
-                initialValues={props.initialValues}
-                layout={props.layout}
-                footer={props.footer}
-            >
-                {fields.length > 0 && fields.map((field) => {
-                    return FormFactory.create(field) as React.ReactNode;
-                })}
-
-                {props.children}
-
-            </MobileForm>
-        </FormContext.Provider>
-    )
-}
-
-type FormType = typeof FormComponent;
-type FormComponentType = FormType & {
-    useForm: ()=>FormInstance;
-};
-
-const Form = FormComponent as FormComponentType;
-Form.useForm = ()=>{
-    return new FormInstance();
-};
-
-export default Form;
-
diff --git a/mobile-ui/src/components/form/input.tsx b/mobile-ui/src/components/form/input.tsx
deleted file mode 100644
index e89401ba..00000000
--- a/mobile-ui/src/components/form/input.tsx
+++ /dev/null
@@ -1,36 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Input} from "antd-mobile";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormInput: React.FC<FormItemProps> = (props) => {
-
-    const inputType = props.inputType || "text";
-    const {formContext, rules} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-        >
-            <Input
-                value={props.value}
-                clearable={true}
-                type={inputType}
-                placeholder={props.placeholder}
-                maxLength={props.inputMaxLength}
-                onChange={(value) => {
-                    formContext?.setFieldValue(props.name, value);
-                    props.onChange && props.onChange(value, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormInput;
diff --git a/mobile-ui/src/components/form/listener.ts b/mobile-ui/src/components/form/listener.ts
deleted file mode 100644
index 47c13d06..00000000
--- a/mobile-ui/src/components/form/listener.ts
+++ /dev/null
@@ -1,64 +0,0 @@
-import {NamePath} from "antd-mobile/es/components/form";
-
-// Form字段组件刷新控制监听上下文对象
-export class FormFieldReloadListenerContext {
-
-    private readonly map:Map<string,()=>void>;
-
-    constructor() {
-        this.map = new Map();
-    }
-
-    public addListener(name:NamePath,listener:()=>void){
-        const key = Array.isArray(name)?name.join("."):name;
-        this.map.set(key, listener);
-    }
-
-
-    public notify(name:NamePath){
-        const key = Array.isArray(name)?name.join("."):name;
-        const listener = this.map.get(key);
-        if(listener){
-            listener();
-        }
-    }
-
-    public notifyAll(){
-        this.map.forEach(listener=>{
-            listener();
-        })
-    }
-
-}
-
-// Form字段组件选项刷新控制监听上下文对象
-export class FormFieldOptionListenerContext {
-
-    private readonly map:Map<string,()=>void>;
-
-    constructor() {
-        this.map = new Map();
-    }
-
-    public addListener(name:NamePath,listener:()=>void){
-        const key = Array.isArray(name)?name.join("."):name;
-        this.map.set(key, listener);
-    }
-
-
-    public notify(name:NamePath){
-        const key = Array.isArray(name)?name.join("."):name;
-        const listener = this.map.get(key);
-        if(listener){
-            listener();
-        }
-    }
-
-    public notifyAll(){
-        this.map.forEach(listener=>{
-            listener();
-        })
-    }
-
-}
-
diff --git a/mobile-ui/src/components/form/password.tsx b/mobile-ui/src/components/form/password.tsx
deleted file mode 100644
index 55ad6ed7..00000000
--- a/mobile-ui/src/components/form/password.tsx
+++ /dev/null
@@ -1,45 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Input} from "antd-mobile";
-import {EyeInvisibleOutline, EyeOutline} from "antd-mobile-icons";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormPassword: React.FC<FormItemProps> = (props) => {
-
-    const [visible, setVisible] = React.useState(false);
-
-    const {formContext, rules} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-        >
-            <div className={"form-password"}>
-                <Input
-                    type={visible ? "text" : "password"}
-                    value={props.value}
-                    placeholder={props.placeholder}
-                    onChange={(value) => {
-                        formContext?.setFieldValue(props.name, value);
-                        props.onChange && props.onChange(value, formContext);
-                    }}
-                />
-                <div className={"form-password-eye"}>
-                    {!visible ? (
-                        <EyeInvisibleOutline onClick={() => setVisible(true)}/>
-                    ) : (
-                        <EyeOutline onClick={() => setVisible(false)}/>
-                    )}
-                </div>
-            </div>
-        </Form.Item>
-    )
-}
-
-export default FormPassword;
diff --git a/mobile-ui/src/components/form/radio.tsx b/mobile-ui/src/components/form/radio.tsx
deleted file mode 100644
index 00b0ad08..00000000
--- a/mobile-ui/src/components/form/radio.tsx
+++ /dev/null
@@ -1,57 +0,0 @@
-import React, {useEffect} from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Radio, Space} from "antd-mobile";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormRadio: React.FC<FormItemProps> = (props) => {
-    const [options, setOptions] = React.useState(props.options);
-
-    const {formContext, rules} = formFieldInit(props, () => {
-        reloadOptions();
-    });
-
-    const reloadOptions = () => {
-        if (props.loadOptions) {
-            props.loadOptions(formContext).then(res => {
-                setOptions(res);
-            });
-        }
-    }
-
-    useEffect(() => {
-        reloadOptions();
-    }, []);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-        >
-            <Radio.Group
-                value={props.value}
-                onChange={(value) => {
-                    formContext?.setFieldValue(props.name, value);
-                    props.onChange && props.onChange(value, formContext);
-                }}
-            >
-                <Space direction={props.radioDirection}>
-                    {options?.map(item => {
-                        return (
-                            <Radio
-                                value={item.value}
-                                disabled={item.disable}
-                            >{item.label}</Radio>
-                        )
-                    })}
-                </Space>
-            </Radio.Group>
-        </Form.Item>
-    )
-}
-
-export default FormRadio;
diff --git a/mobile-ui/src/components/form/rate.tsx b/mobile-ui/src/components/form/rate.tsx
deleted file mode 100644
index 6936325e..00000000
--- a/mobile-ui/src/components/form/rate.tsx
+++ /dev/null
@@ -1,32 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Rate} from "antd-mobile";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormRate: React.FC<FormItemProps> = (props) => {
-    const {formContext, rules} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-        >
-            <Rate
-                count={props.rateCount}
-                allowHalf={props.rateAllowHalf}
-                value={props.value}
-                onChange={(value) => {
-                    formContext?.setFieldValue(props.name, value);
-                    props.onChange && props.onChange(value, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormRate;
diff --git a/mobile-ui/src/components/form/select.tsx b/mobile-ui/src/components/form/select.tsx
deleted file mode 100644
index 8bae7b86..00000000
--- a/mobile-ui/src/components/form/select.tsx
+++ /dev/null
@@ -1,426 +0,0 @@
-import React, {useEffect} from "react";
-import {FormItemProps, FormOption} from "@/components/form/types";
-import {Button, CheckList, Form as AntdForm, InfiniteScroll, Popup, PullToRefresh, SearchBar} from "antd-mobile";
-import {RightOutline, SetOutline} from "antd-mobile-icons";
-import formFieldInit from "@/components/form/common";
-import Form from "@/components/form";
-import "./form.scss";
-
-
-const valueToForm = (value: string) => {
-    if (value && value.length > 0) {
-        return value.split(",");
-    }
-    return value;
-}
-
-const formToValue = (value: string[]) => {
-    if (value && value.length > 0) {
-        return value.join(",")
-    }
-    return value;
-}
-
-interface CheckboxItemProps {
-    item: FormOption;
-    paths: FormOption[];
-    setPaths: (paths: FormOption[]) => void;
-    setOptions: (options: FormOption[]) => void;
-
-}
-
-const CheckboxItem: React.FC<CheckboxItemProps> = (props) => {
-    const {item, paths, setPaths, setOptions} = props;
-    if (item.children && item.children.length > 0) {
-        return (
-            <CheckList.Item
-                value={item.value}
-                disabled={item.disable}
-                readOnly={true}
-            >
-                <div
-                    className={"checkbox-parent"}
-                    onClick={() => {
-                        setPaths([...paths, item]);
-                        setOptions(item.children || []);
-                    }}
-                >
-                    {item.label}
-                    <RightOutline/>
-                </div>
-            </CheckList.Item>
-        )
-    }
-    return (
-        <CheckList.Item
-            value={item.value}
-            disabled={item.disable}
-        >
-            {item.label}
-        </CheckList.Item>
-    )
-}
-
-interface CheckboxListViewProps {
-    data: FormOption[];
-    paths: FormOption[];
-    setPaths: (paths: FormOption[]) => void;
-    setOptions: (options: FormOption[]) => void;
-}
-
-const CheckboxListView: React.FC<CheckboxListViewProps> = (props) => {
-    const {data} = props;
-    const pageSize = 20;
-
-    const [currentPage, setCurrentPage] = React.useState(1);
-
-    const [list, setList] = React.useState<FormOption[]>([]);
-
-    const [hasMore, setHasMore] = React.useState(true);
-
-    const reload = () => {
-        const currentPage = 1;
-        if (data.length > 0) {
-            const list = data.slice((currentPage - 1) * pageSize, currentPage * pageSize);
-            setList(list);
-            setHasMore(true);
-        } else {
-            setList([]);
-            setHasMore(false);
-        }
-        setCurrentPage(currentPage);
-    }
-
-    const loadMore = () => {
-        setCurrentPage(prevState => {
-            const newPage = prevState + 1;
-            if (newPage * pageSize >= data.length) {
-                setHasMore(false);
-            } else {
-                setHasMore(true);
-            }
-            setList(prevState => {
-                const list = data.slice((newPage - 1) * pageSize, newPage * pageSize);
-                return [...prevState, ...list]
-            });
-            return newPage;
-        });
-    }
-
-
-    useEffect(() => {
-        reload();
-    }, [props.data]);
-
-    return (
-        <>
-            <PullToRefresh
-                onRefresh={async () => {
-                    reload();
-                }}
-            >
-                {list && list.map((item: FormOption, index: number) => {
-                    return <CheckboxItem key={index} item={item} {...props}/>
-                })}
-
-                {hasMore && (
-                    <InfiniteScroll
-                        loadMore={async () => {
-                            loadMore();
-                        }}
-                        hasMore={hasMore}
-                    />
-                )}
-
-            </PullToRefresh>
-        </>
-    )
-}
-
-const FormSelect: React.FC<FormItemProps> = (props) => {
-
-    const [visible, setVisible] = React.useState(false);
-    const [searchText, setSearchText] = React.useState('');
-
-    const {formContext, rules} = formFieldInit(props, () => {
-        reloadOptions();
-    });
-
-    const currentValue = valueToForm(formContext?.getFieldValue(props.name)) as string[] || valueToForm(props.value) as string[] || [];
-
-    const [selected, setSelected] = React.useState<string[]>(currentValue);
-
-    const [settingOptionVisible, setSettingOptionVisible] = React.useState(false);
-
-    // 当前页面展示的选项的数据，会随着树级目录进入子数据，从而更新数据
-    const [options, setOptions] = React.useState(props.options);
-
-    // 用于展示数据的缓存数据，在数据插入不在更新
-    const [optionCaches, setOptionCaches] = React.useState(props.options);
-
-    const [paths, setPaths] = React.useState<FormOption[]>([]);
-
-    const CheckBoxValueText = () => {
-        const currentValue = valueToForm(formContext?.getFieldValue(props.name)) as string[] || valueToForm(props.value) as string[] || [];
-        const optionLabelFetch = (value: string) => {
-            let label = value;
-            let fetchState = false;
-            const loadLabel = (item: FormOption) => {
-                if (!fetchState) {
-                    if (item.value === value) {
-                        label = item.label;
-                        fetchState = true;
-                    }
-                    if (item.children) {
-                        item.children.forEach(child => {
-                            loadLabel(child);
-                        })
-                    }
-                }
-            }
-
-            optionCaches?.forEach(item => {
-                loadLabel(item);
-            })
-            return label;
-        }
-        const displaySpan = (list: string[]) => {
-            if (list.length > 0) {
-                return (
-                    <span
-                        onClick={() => {
-                            setVisible(true);
-                        }}>
-                {list &&
-                    list.map(item => {
-                        return optionLabelFetch(item);
-                    }).join(",")
-                }
-            </span>
-                )
-            } else {
-                return (
-                    <span
-                        className={"placeholder-span"}
-                        onClick={() => {
-                            setVisible(true);
-                        }}>
-                    {props.placeholder || "请选择"}
-                </span>
-                )
-            }
-        }
-        return displaySpan(currentValue);
-    }
-
-    const reloadOptions = () => {
-        if (props.loadOptions) {
-            props.loadOptions(formContext).then(list => {
-                setOptions(list);
-                setOptionCaches(list);
-            });
-        }
-    }
-
-    useEffect(() => {
-        setPaths([]);
-        reloadOptions();
-    }, []);
-
-
-    useEffect(() => {
-        setSearchText('');
-        if (visible) {
-            setPaths([]);
-            setSelected(currentValue);
-            reloadOptions();
-        }
-    }, [visible]);
-
-    const selectOptionFormEditInstance = Form.useForm();
-
-
-    const handlerOptionFormFinish = () => {
-        if (props.onSelectOptionFormFinish && selectOptionFormEditInstance && formContext) {
-            props.onSelectOptionFormFinish(
-                formContext,
-                selectOptionFormEditInstance,
-                reloadOptions,
-                () => {
-                    setSettingOptionVisible(false);
-                    setVisible(false);
-                }
-            );
-        }
-    }
-
-    return (
-        <AntdForm.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-            extra={(
-                <RightOutline
-                    onClick={() => {
-                        setVisible(true);
-                    }}
-                />
-            )}
-            getValueProps={(value) => {
-                if (value) {
-                    return {
-                        value: valueToForm(value)
-                    }
-                }
-                return value
-            }}
-        >
-            <CheckBoxValueText/>
-
-            <Popup
-                visible={visible}
-                className={"select-popup"}
-                onMaskClick={() => {
-                    setVisible(false)
-                }}
-                destroyOnClose={true}
-            >
-                <div className={"select-popup-header"}>
-                    <a
-                        onClick={() => {
-                            setVisible(false)
-                        }}
-                    >取消</a>
-                    {settingOptionVisible && (
-                        <>
-                            {props.selectOptionFormEditFooterOkText || "添加选项"}
-                        </>
-                    )}
-                    <a
-                        onClick={() => {
-                            if (props.selectOptionFormEditable) {
-                                handlerOptionFormFinish();
-                            } else {
-                                formContext?.setFieldValue(props.name, formToValue(selected));
-                                props.onChange && props.onChange(selected, formContext);
-                                setVisible(false);
-                            }
-                        }}
-                    >确定</a>
-                </div>
-                {!settingOptionVisible && (
-                    <div className={"select-popup-search"}>
-                        <SearchBar
-                            className={"select-popup-search-bar"}
-                            placeholder='输入查询选项'
-                            value={searchText}
-                            onChange={v => {
-                                setSearchText(v);
-                            }}
-                        />
-                        {props.selectOptionFormEditable && (
-                            <SetOutline
-                                className={"select-popup-search-button"}
-                                onClick={() => {
-                                    setSettingOptionVisible(!settingOptionVisible);
-                                }}
-                            />
-                        )}
-                    </div>
-                )}
-
-                {paths.length > 0 && (
-                    <div className={"select-popup-navbar"}>
-                        {paths.map((item, index) => {
-                            return (
-                                <div className={"select-popup-navbar-item"}>
-                                    <a
-                                        className={"span"}
-                                        onClick={() => {
-                                            setPaths(paths.slice(0, index + 1));
-                                            setOptions(item.children);
-                                        }}
-                                    >{item.label}</a>
-                                    <RightOutline className={"arrow"}/>
-                                </div>
-                            )
-                        })}
-                    </div>
-                )}
-
-                <div className={"select-popup-content"}>
-
-                    {settingOptionVisible && (
-                        <div className={"select-popup-content-custom-form"}>
-                            {formContext && props.selectOptionFormEditView && (
-                                <props.selectOptionFormEditView
-                                    currentInstance={selectOptionFormEditInstance}
-                                    formInstance={formContext}/>
-                            )}
-                            <div className={"select-popup-content-custom-footer"}>
-                                <Button
-                                    size={'middle'}
-                                    color={'primary'}
-                                    onClick={() => {
-                                        handlerOptionFormFinish();
-                                    }}
-                                >{props.selectOptionFormEditFooterOkText || "添加"}</Button>
-                                <Button
-                                    size={'middle'}
-                                    onClick={() => {
-                                        setSettingOptionVisible(false);
-                                    }}
-                                >{props.selectOptionFormEditFooterOkText || "取消"}</Button>
-                            </div>
-
-                        </div>
-                    )}
-
-                    {!settingOptionVisible && (
-                        <CheckList
-                            className={"select-popup-content-list"}
-                            value={selected}
-                            onChange={(value) => {
-                                const currentValue = value as string[];
-                                setSelected(currentValue);
-                                // 单选时，选中即关闭弹框
-                                if (!props.selectMultiple) {
-                                    formContext?.setFieldValue(props.name, formToValue(currentValue));
-                                    props.onChange && props.onChange(formToValue(currentValue), formContext);
-
-                                    setVisible(false);
-                                }
-                            }}
-                            multiple={props.selectMultiple}
-                        >
-                            <CheckboxListView
-                                data={options && options
-                                        .filter((item => {
-                                            if (searchText) {
-                                                if (item.value.toUpperCase().includes(searchText.toUpperCase())) {
-                                                    return true;
-                                                }
-                                                if (item.label.toUpperCase().includes(searchText.toUpperCase())) {
-                                                    return true;
-                                                }
-                                                return false;
-                                            }
-                                            return true;
-                                        }))
-                                    || []}
-                                setOptions={setOptions}
-                                paths={paths}
-                                setPaths={setPaths}
-                            />
-                        </CheckList>
-                    )}
-                </div>
-            </Popup>
-        </AntdForm.Item>
-    )
-}
-
-export default FormSelect;
diff --git a/mobile-ui/src/components/form/selector.tsx b/mobile-ui/src/components/form/selector.tsx
deleted file mode 100644
index 42daecea..00000000
--- a/mobile-ui/src/components/form/selector.tsx
+++ /dev/null
@@ -1,73 +0,0 @@
-import React, {useEffect} from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Selector} from "antd-mobile";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const valueToForm = (value: string) => {
-    if (value && value.length > 0) {
-        return value.split(",");
-    }
-    return value;
-}
-
-const formToValue = (value: string[]) => {
-    if (value && value.length > 0) {
-        return value.join(",")
-    }
-    return value;
-}
-
-
-const FormSelector: React.FC<FormItemProps> = (props) => {
-
-    const [options, setOptions] = React.useState(props.options);
-
-    const {formContext, rules} = formFieldInit(props, () => {
-        reloadOptions();
-    });
-
-    const reloadOptions = () => {
-        if (props.loadOptions) {
-            props.loadOptions(formContext).then(res => {
-                setOptions(res);
-            });
-        }
-    }
-
-    useEffect(() => {
-        reloadOptions();
-    }, []);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-            getValueProps={(value) => {
-                if (value) {
-                    return {
-                        value: valueToForm(value)
-                    }
-                }
-                return value
-            }}
-        >
-            <Selector
-                multiple={props.selectorMultiple}
-                columns={props.selectorColumn}
-                options={options || []}
-                value={props.value}
-                onChange={(e) => {
-                    formContext?.setFieldValue(props.name, formToValue(e));
-                    props.onChange && props.onChange(e, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormSelector;
diff --git a/mobile-ui/src/components/form/slider.tsx b/mobile-ui/src/components/form/slider.tsx
deleted file mode 100644
index 08291774..00000000
--- a/mobile-ui/src/components/form/slider.tsx
+++ /dev/null
@@ -1,38 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Slider} from "antd-mobile";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormSlider: React.FC<FormItemProps> = (props) => {
-
-    const {formContext, rules} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-        >
-            <Slider
-                value={props.value}
-                max={props.sliderMaxNumber}
-                min={props.sliderMinNumber}
-                step={props.sliderStep}
-                range={props.sliderRange}
-                ticks={props.sliderTicks}
-                popover={props.sliderPopover}
-                marks={props.sliderMarks}
-                onChange={(value) => {
-                    formContext?.setFieldValue(props.name, value);
-                    props.onChange && props.onChange(value, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormSlider;
diff --git a/mobile-ui/src/components/form/stepper.tsx b/mobile-ui/src/components/form/stepper.tsx
deleted file mode 100644
index 5d6d4843..00000000
--- a/mobile-ui/src/components/form/stepper.tsx
+++ /dev/null
@@ -1,34 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Stepper} from "antd-mobile";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormStepper: React.FC<FormItemProps> = (props) => {
-
-    const {formContext, rules} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-        >
-            <Stepper
-                value={props.value}
-                max={props.stepperMaxNumber}
-                min={props.stepperMinNumber}
-                digits={props.stepperDecimalLength}
-                onChange={(value) => {
-                    formContext?.setFieldValue(props.name, value);
-                    props.onChange && props.onChange(value, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormStepper;
diff --git a/mobile-ui/src/components/form/switch.tsx b/mobile-ui/src/components/form/switch.tsx
deleted file mode 100644
index 566b48a5..00000000
--- a/mobile-ui/src/components/form/switch.tsx
+++ /dev/null
@@ -1,44 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Switch as AntSwitch} from "antd-mobile";
-import {SwitchProps as AntdSwitchProps} from "antd-mobile/es/components/switch/switch";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-interface SwitchProps extends AntdSwitchProps {
-    value?: boolean;
-}
-
-const Switch: React.FC<SwitchProps> = ({value, ...props}) => {
-    return (
-        <AntSwitch checked={value} {...props}/>
-    )
-}
-
-const FormSwitch: React.FC<FormItemProps> = (props) => {
-
-    const {formContext, rules} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-        >
-            <Switch
-                value={props.value}
-                checkedText={props.switchCheckText}
-                uncheckedText={props.switchUnCheckText}
-                onChange={(value) => {
-                    formContext?.setFieldValue(props.name, value);
-                    props.onChange && props.onChange(value, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormSwitch;
diff --git a/mobile-ui/src/components/form/textarea.tsx b/mobile-ui/src/components/form/textarea.tsx
deleted file mode 100644
index 0807f0b2..00000000
--- a/mobile-ui/src/components/form/textarea.tsx
+++ /dev/null
@@ -1,35 +0,0 @@
-import React from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, TextArea} from "antd-mobile";
-import formFieldInit from "@/components/form/common";
-import "./form.scss";
-
-const FormTextArea: React.FC<FormItemProps> = (props) => {
-
-    const {formContext, rules} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-        >
-            <TextArea
-                value={props.value}
-                showCount={true}
-                placeholder={props.placeholder}
-                maxLength={props.textAreaMaxLength}
-                rows={props.textAreaRows}
-                onChange={(value) => {
-                    formContext?.setFieldValue(props.name, value);
-                    props.onChange && props.onChange(value, formContext);
-                }}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormTextArea;
diff --git a/mobile-ui/src/components/form/types.tsx b/mobile-ui/src/components/form/types.tsx
deleted file mode 100644
index 9e0095fd..00000000
--- a/mobile-ui/src/components/form/types.tsx
+++ /dev/null
@@ -1,165 +0,0 @@
-import {NamePath} from "antd-mobile/es/components/form";
-import {FormValidateContent} from "@/components/form/validate";
-import {FormAction} from "@/components/form";
-import React from "react";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-// Form表单选项类型
-export interface FormOption {
-    label: string;
-    value: string;
-    disable?: boolean;
-    children?: FormOption[];
-}
-
-// Form表单类型
-type FormFieldType =
-    "input" | "cascader" | "select" | "password" | "date" |
-    "radio" | "textarea" | "checkbox" | "uploader" | "switch" |
-    "stepper" | "slider" | "rate" | "selector" | "captcha";
-
-// FormField
-export interface FormField {
-    // 表单字段类型
-    type: FormFieldType;
-    // 表单字段属性
-    props: FormItemProps;
-}
-
-// 自定义Select组件选项维护视图
-export interface SelectOptionFormEditProps {
-    // 当前表单操作对象
-    currentInstance?: FormInstance;
-    // 父级表单操作对象
-    formInstance?: FormInstance;
-}
-
-// Form表单字段属性
-export interface FormItemProps {
-    // 是否隐藏字段
-    hidden?: boolean;
-    // 是否禁用
-    disabled?: boolean;
-    // 是否必填,当为true时会自动给rules添加required校验
-    required?: boolean;
-    // 表单字段名
-    name?: NamePath;
-    // 表单字段标签
-    label?: React.ReactNode;
-    // 帮助提示信息
-    help?: string;
-    // 表单值
-    value?: any;
-    // 输入提示
-    placeholder?: string;
-    // 变更事件
-    onChange?: (value: any, form?: FormInstance) => void;
-    // 静态选项，对应loadOptions的动态选项，仅限于select、radio等组件有效
-    options?: FormOption[],
-    // 动态加载选项,仅限于select、radio等组件有效
-    loadOptions?: (form?: FormInstance) => Promise<FormOption[]>,
-    // 动态校验函数,尽在fields模式下生效
-    validateFunction?: (content: FormValidateContent) => Promise<string[]>,
-
-    /** 以下为表单字段的拓展熟悉，非公共属性 **/
-    // 单选框方向
-    radioDirection?: "vertical" | "horizontal",
-    // 多选框方向
-    checkboxDirection?: "vertical" | "horizontal",
-    // TextArea输入行数
-    textAreaRows?: number,
-    // TextArea输入框最大值
-    textAreaMaxLength?: number,
-    // select组件是否支持多选
-    selectMultiple?: boolean,
-    // select组件添加的视图是否开启编辑
-    selectOptionFormEditable?: boolean,
-    // select组件添加的视图
-    selectOptionFormEditView?: React.ComponentType<SelectOptionFormEditProps>,
-    // select组件添加的视图title，默认添加选项
-    selectOptionFormEditTitle?: string,
-    // select组件添加的视图footer确定按钮文字，默认添加选项
-    selectOptionFormEditFooterOkText?: string,
-    // select组件添加的视图footer取消按钮文字，默认取消添加
-    selectOptionFormEditFooterCancelText?: string,
-    // Select组件添加数据事件
-    onSelectOptionFormFinish?: (formInstance: FormInstance,
-                                selectOptionFormEditFormInstance: FormInstance,
-                                reloadOption?: () => void,
-                                close?: () => void) => void;
-
-    // 文件上传接受的文件类型，默认为 image/*
-    uploaderAccept?: string,
-    // 文件上传最大数量
-    uploaderMaxCount?: number,
-    // input输入框最大值
-    inputMaxLength?: number,
-    // input输入框类型，默认为text
-    inputType?: "text" | "number",
-    // date组件的日期格式，默认YYYY-MM-DD
-    dateFormat?: string,
-    // date组件的精度，默认为day
-    datePrecision?: "year" | "month" | "day" | "hour" | "minute" | "second" | "week" | "week-day" | "quarter",
-    // switch选择文本
-    switchCheckText?: string,
-    // switch未选择文本
-    switchUnCheckText?: string,
-    // stepper组件的最大值
-    stepperMaxNumber?: number,
-    // stepper组件的最小值
-    stepperMinNumber?: number,
-    // stepper组件的小数位
-    stepperDecimalLength?: number,
-    // slider组件的最大值
-    sliderMaxNumber?: number,
-    // slider组件的最小值
-    sliderMinNumber?: number,
-    // slider组件的拖动步距
-    sliderStep?: number,
-    // slider组件实现展示刻度
-    sliderTicks?: boolean,
-    // slider组件悬浮提示
-    sliderPopover?: boolean,
-    // slider组件是否双向滑动
-    sliderRange?: boolean,
-    // slider组件的刻度尺
-    sliderMarks?: any,
-    // rate的star总数
-    rateCount?: number,
-    // rate允许半选
-    rateAllowHalf?: boolean,
-    // selector组件是否多选
-    selectorMultiple?: boolean,
-    // selector组件每行展示数量
-    selectorColumn?: number,
-    // Captcha组件切换验证码事件
-    onCaptchaChange?: (value: string) => void;
-    // Captcha组件刷新验证码事件
-    onCaptchaRefresh?: () => Promise<{
-        // 验证码标志
-        code: string;
-        // 验证码图片地址
-        url: string;
-    } | null>;
-    // 文件上传事件
-    onUploaderUpload?: (filename: string, base64: string) => Promise<{
-        // 文件id
-        id: string,
-        // 文件名
-        name: string
-        // 文件地址
-        url: string;
-    }>
-    // 文件加载事件
-    onUploaderLoad?: (ids: string) => Promise<{
-        // 文件id
-        id: string,
-        // 文件名
-        name: string
-        // 文件地址
-        url: string;
-    }[]>
-
-}
-
-
diff --git a/mobile-ui/src/components/form/uploder.tsx b/mobile-ui/src/components/form/uploder.tsx
deleted file mode 100644
index 47af99fb..00000000
--- a/mobile-ui/src/components/form/uploder.tsx
+++ /dev/null
@@ -1,182 +0,0 @@
-import React, {useEffect} from "react";
-import {FormItemProps} from "@/components/form/types";
-import {Form, Image, ImageUploader, ImageUploadItem as AntImageUploadItem, ImageViewer} from "antd-mobile";
-import formFieldInit from "@/components/form/common";
-import {CloseCircleFill} from "antd-mobile-icons";
-import "./form.scss";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-const fileToBase64 = (file: File): Promise<string> => {
-    return new Promise((resolve, reject) => {
-        const reader = new FileReader();
-        reader.readAsDataURL(file);
-        reader.onload = () => resolve(reader.result as string);
-        reader.onerror = error => reject(error);
-    });
-}
-
-interface UploaderProps {
-    name: string;
-    formInstance?: FormInstance;
-    uploaderAccept?: string;
-    uploaderMaxCount?: number;
-    value?: any;
-    onChange?: (value: any, form?: FormInstance) => void;
-    // 文件上传事件
-    onUploaderUpload?: (filename: string, base64: string) => Promise<{
-        // 文件id
-        id: string,
-        // 文件名
-        name: string
-        // 文件地址
-        url: string;
-    }>
-    // 文件加载事件
-    onUploaderLoad?: (ids: string) => Promise<{
-        // 文件id
-        id: string,
-        // 文件名
-        name: string
-        // 文件地址
-        url: string;
-    }[]>
-}
-
-interface ImageUploadItem extends AntImageUploadItem{
-    id?:string;
-    name?:string;
-}
-
-const Uploader: React.FC<UploaderProps> = (props) => {
-    const accept = props.uploaderAccept || "image/*";
-
-    const [visible, setVisible] = React.useState(false);
-    const formInstance = props.formInstance;
-
-    const [fileList, setFileList] = React.useState<ImageUploadItem[]>([]);
-
-    const [showImage, setShowImage] = React.useState<string>('');
-
-    const handlerUploader = async (file: File) => {
-        const base64 = await fileToBase64(file);
-        const filename = file.name;
-
-        if(props.onUploaderUpload ){
-            return await props.onUploaderUpload(filename, base64);
-        }else {
-            return {
-                url: URL.createObjectURL(file)
-            }
-        }
-    }
-
-    const reloadFiles = () => {
-        if (props.value) {
-            if(props.onUploaderLoad ){
-                props.onUploaderLoad(props.value).then(res => {
-                    if(res) {
-                        setFileList(res.map((item: any) => {
-                            return {
-                                url: item.url,
-                                id: item.id,
-                                name: item.name
-                            }
-                        }))
-                    }
-                });
-            }
-        }
-    }
-
-    useEffect(() => {
-        reloadFiles();
-    }, [props.value]);
-
-    const handlerDeleteFile = (file: any) => {
-        // 删除文件
-        const updatedFileList = fileList.filter((item: any) => item.id !== file.id);
-        setFileList(updatedFileList);
-
-        // 更新表单字段
-        const currentValue = updatedFileList?.map((item: any) => item.id).join(",");
-        formInstance?.setFieldValue(props.name, currentValue);
-        props.onChange && props.onChange(currentValue, formInstance);
-    };
-
-    return (
-        <>
-            <ImageViewer
-                image={showImage}
-                visible={visible}
-                onClose={() => {
-                    setVisible(false)
-                }}
-            />
-            <ImageUploader
-                maxCount={props.uploaderMaxCount}
-                accept={accept}
-                value={fileList}
-                onChange={(fileList) => {
-                    const currentValue = fileList?.map((item: any) => item.id).join(",");
-                    formInstance && formInstance?.setFieldValue(props.name, currentValue);
-                    props.onChange && props.onChange(currentValue, formInstance);
-                    setFileList(fileList);
-                }}
-                upload={handlerUploader as any}
-                renderItem={(originNode, file: any, fileList) => {
-                    if (accept === "image/*") {
-                        return (
-                            <div className={"form-uploader-file"}>
-                                <CloseCircleFill
-                                    className={"delete-icon"}
-                                    onClick={() => handlerDeleteFile(file)}
-                                />
-                                <Image
-                                    src={file.url}
-                                    width={80}
-                                    onClick={() => {
-                                        setShowImage(file.url);
-                                        setVisible(true);
-                                    }}
-                                />
-                            </div>
-                        )
-                    }
-                    return (
-                        <div className={"form-uploader-file"}>
-                            <CloseCircleFill
-                                className={"delete-icon"}
-                                onClick={() => handlerDeleteFile(file)}
-                            />
-                            <a href={file.url}>{file.name}</a>
-                        </div>
-                    )
-                }}
-            />
-        </>
-    )
-}
-
-const FormUploader: React.FC<FormItemProps> = (props) => {
-    const {formContext, rules} = formFieldInit(props);
-
-    return (
-        <Form.Item
-            name={props.name}
-            label={props.label}
-            rules={rules}
-            hidden={props.hidden}
-            help={props.help}
-            disabled={props.disabled}
-        >
-            <Uploader
-                name={props.name}
-                value={props.value}
-                formInstance={formContext}
-                {...props}
-            />
-        </Form.Item>
-    )
-}
-
-export default FormUploader;
diff --git a/mobile-ui/src/components/form/utils.ts b/mobile-ui/src/components/form/utils.ts
deleted file mode 100644
index 1e0be44f..00000000
--- a/mobile-ui/src/components/form/utils.ts
+++ /dev/null
@@ -1,30 +0,0 @@
-import {FormValidateContent} from "@/components/form/validate";
-
-class ValidateUtils {
-
-    /**
-     * 非空校验
-     * @param content 校验对象
-     * @param message 错误信息
-     */
-    static validateNotEmpty = async (content: FormValidateContent, message?: string) => {
-        const field = content.getFieldProps();
-        const errorMessage = message ? message : field?.props.label + '不能为空' || '不能为空';
-        const value = content.value;
-        if (value) {
-            if (Array.isArray(value)) {
-                if (value.length === 0) {
-                    return [errorMessage];
-                }else {
-                    return [];
-                }
-            } else {
-                return [];
-            }
-        } else {
-            return [errorMessage];
-        }
-    }
-}
-
-export default ValidateUtils;
diff --git a/mobile-ui/src/components/form/validate.ts b/mobile-ui/src/components/form/validate.ts
deleted file mode 100644
index 3b1e2027..00000000
--- a/mobile-ui/src/components/form/validate.ts
+++ /dev/null
@@ -1,91 +0,0 @@
-import {NamePath} from "rc-field-form/es/interface";
-import FormInstance from "@/components/form/domain/FormInstance";
-
-// 流程表单验证内容
-export class FormValidateContent {
-    readonly value: any;
-    readonly name: NamePath;
-    readonly form: FormInstance;
-
-    constructor(value: any,name: NamePath, form: FormInstance) {
-        this.value = value;
-        this.name = name;
-        this.form = form;
-    }
-
-    getFieldProps = () => {
-        return this.form.getFieldProps(this.name);
-    }
-}
-
-// 自定义验证上下文
-export class FormValidateContext {
-
-    private readonly map: Map<NamePath, (content: FormValidateContent) => Promise<string[]>>;
-
-    constructor() {
-        this.map = new Map<NamePath, (content: FormValidateContent) => Promise<string[]>>();
-    }
-
-    public addValidateFunction(name:NamePath,validateFunction: (content: FormValidateContent) => Promise<string[]>) {
-        this.map.set(name, validateFunction);
-    }
-
-    public clear(){
-        this.map.clear();
-    }
-
-    public getValidate(name:NamePath){
-        return this.map.get(name);
-    }
-
-
-    public validateField =  (name:NamePath,form: FormInstance) => {
-        return new Promise((resolve,reject)=>{
-            const value = form.getFieldValue(name);
-            const content = new FormValidateContent(value,name,form);
-            const validateFunction = this.getValidate(name);
-            if(validateFunction) {
-                validateFunction(content)
-                    .then((res) => {
-                        form.setFields(
-                            [
-                                {
-                                    name: name,
-                                    errors: res,
-                                }
-                            ]
-                        )
-                        if (res.length > 0) {
-                            resolve(false);
-                        } else {
-                            resolve(true);
-                        }
-                    })
-                    .catch((error) => {
-                        form.setFields(
-                            [
-                                {
-                                    name: name,
-                                    errors: [error],
-                                }
-                            ]
-                        )
-                        console.log('error', error)
-                        reject(false);
-                    })
-            }
-        });
-    }
-
-    public validate = async (form: FormInstance) => {
-        const list = Array.from(this.map.keys().map(item => {
-           return this.validateField(item,form);
-        }));
-
-        const results = await Promise.all(list);
-        return results.every((result) => result);
-    }
-}
-
-
diff --git a/mobile-ui/src/components/info/FormInfo/index.tsx b/mobile-ui/src/components/info/FormInfo/index.tsx
index fad57c37..cafa188a 100644
--- a/mobile-ui/src/components/info/FormInfo/index.tsx
+++ b/mobile-ui/src/components/info/FormInfo/index.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import Index, {FormProps} from "@/components/form";
+import {FormProps,Form} from "@codingapi/form-mobile";
 import "./index.scss";
 
 interface FormInfoProps extends FormProps {
@@ -11,7 +11,7 @@ const FormInfo: React.FC<FormInfoProps> = (props) => {
         <div className={"form-info"}>
             <div className={"form-header-title"}>{props.title}</div>
             <div className={"form-content"}>
-                <Index {...props}/>
+                <Form {...props}/>
             </div>
         </div>
     )
diff --git a/mobile-ui/src/framework/ComponentBus/index.tsx b/mobile-ui/src/framework/ComponentBus/index.tsx
deleted file mode 100644
index 22528f84..00000000
--- a/mobile-ui/src/framework/ComponentBus/index.tsx
+++ /dev/null
@@ -1,78 +0,0 @@
-import React from "react";
-import {loadRemoteComponent, loadRemoteScript} from "@/utils/dynamicLoader";
-
-class ComponentBus {
-
-    private readonly componentBus = new Map<string, React.ComponentType<any>>();
-
-    /**
-     * 注册组件
-     * @param key 组件key
-     * @param component 组件类型
-     */
-    public registerComponent = (key: string, component: React.ComponentType<any>) => {
-        this.componentBus.set(key, component);
-    }
-
-    /**
-     * 删除组件
-     * @param key  组件key
-     */
-    public removeComponent = (key: string) => {
-        this.componentBus.delete(key);
-    }
-
-    /**
-     * 注册远程组件
-     * @param key 组件key
-     * @param remoteUrl 远程组件地址
-     * @param scope     远程组件作用域
-     * @param module    远程组件名称
-     */
-    public registerRemoteComponent = (key: string, remoteUrl: string, scope: string, module: string): Promise<boolean> => {
-        return new Promise((resolve, reject) => {
-            loadRemoteScript(remoteUrl).then(() => {
-                loadRemoteComponent(scope, module)
-                    .then((ComponentModule: any) => {
-                        const Component = ComponentModule.default || ComponentModule;
-                        this.registerComponent(key, Component);
-                        resolve(true);
-                    }).catch(error => {
-                    reject(error);
-                });
-            }).catch(error => {
-                reject(error);
-            });
-        })
-    }
-
-    /**
-     * 获取组件
-     * @param key 组件key
-     * @param defaultComponent 默认组件
-     */
-    public getComponent = <T extends {} = any>(key: string, defaultComponent?: React.ComponentType<T>): React.ComponentType<T> | undefined => {
-        const component = this.componentBus.get(key) as React.ComponentType<T> | undefined;
-        if (component) {
-            return component;
-        }
-        if (defaultComponent) {
-            return defaultComponent;
-        }
-        return undefined;
-    };
-
-    private ComponentBus() {
-        // 私有构造函数，防止外部实例化
-    }
-
-    private static instance: ComponentBus = new ComponentBus();
-
-    // 单例模式
-    public static getInstance(): ComponentBus {
-        return ComponentBus.instance;
-    }
-}
-
-export default ComponentBus;
-
diff --git a/mobile-ui/src/framework/EventBus/index.ts b/mobile-ui/src/framework/EventBus/index.ts
deleted file mode 100644
index d81efb0a..00000000
--- a/mobile-ui/src/framework/EventBus/index.ts
+++ /dev/null
@@ -1,58 +0,0 @@
-class GlobalEvent {
-    private static instance: GlobalEvent;
-    private events: Map<string, Function[]>;
-
-    private constructor() {
-        this.events = new Map();
-    }
-
-    public static getInstance(): GlobalEvent {
-        if (!this.instance) {
-            this.instance = new GlobalEvent();
-        }
-        return this.instance;
-    }
-
-    public on(eventName: string, callback: Function): void {
-        const callbacks = this.events.get(eventName) || [];
-        callbacks.push(callback);
-        this.events.set(eventName, callbacks);
-    }
-
-    public emit(eventName: string, ...args: any[]): void {
-        const callbacks = this.events.get(eventName);
-        if (callbacks) {
-            callbacks.forEach((callback) => {
-                try {
-                    callback(...args);
-                } catch (err) {
-                    console.error(
-                        `Error executing callback for event: ${eventName}`,
-                        err
-                    );
-                }
-            });
-        }
-    }
-
-    public off(eventName: string, callback?: Function): void {
-        if (callback) {
-            const callbacks = this.events.get(eventName);
-            if (callbacks) {
-                const callbackIndex = callbacks.indexOf(callback);
-                if (callbackIndex > -1) {
-                    callbacks.splice(callbackIndex, 1);
-                    if (callbacks.length === 0) {
-                        this.events.delete(eventName);
-                    } else {
-                        this.events.set(eventName, callbacks);
-                    }
-                }
-            }
-        } else {
-            this.events.delete(eventName);
-        }
-    }
-}
-
-export const events = GlobalEvent.getInstance();
diff --git a/mobile-ui/src/pages/flow/detail.tsx b/mobile-ui/src/pages/flow/detail.tsx
index 708305af..eda98b41 100644
--- a/mobile-ui/src/pages/flow/detail.tsx
+++ b/mobile-ui/src/pages/flow/detail.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import Header from "@/layout/Header";
-import {useLocation} from "react-router";
-import FlowView from "@/components/flow/view";
+import {useLocation, useNavigate} from "react-router";
+import {FlowView} from "@codingapi/flow-mobile";
 import {Result} from "antd-mobile";
 import {flowViews} from "@/config/flows";
 
@@ -10,6 +10,7 @@ const FlowDetailPage = () => {
 
     const location = useLocation();
     const state = location.state;
+    const navigate = useNavigate();
 
     if (state) {
         return (
@@ -25,6 +26,10 @@ const FlowDetailPage = () => {
                 <FlowView
                     view={flowViews}
                     id={state.id}
+                    visible={true}
+                    setVisible={()=>{
+                        navigate(-1);
+                    }}
                 />
             </>
         )
diff --git a/mobile-ui/src/pages/levave/create.tsx b/mobile-ui/src/pages/levave/create.tsx
index 73279528..5c7c5dbf 100644
--- a/mobile-ui/src/pages/levave/create.tsx
+++ b/mobile-ui/src/pages/levave/create.tsx
@@ -1,11 +1,13 @@
 import React from "react";
 import Header from "@/layout/Header";
-import FlowView from "@/components/flow/view";
+import {FlowView} from "@codingapi/flow-mobile";
 import LeaveForm from "@/pages/levave/form";
+import {useNavigate} from "react-router";
 
 const LeaveCreatePage = () => {
 
     const username = localStorage.getItem('username');
+    const navigate = useNavigate();
 
     return (
         <div>
@@ -13,9 +15,13 @@ const LeaveCreatePage = () => {
             <FlowView
                 view={LeaveForm}
                 workCode={"leave"}
+                setVisible={()=>{
+                    navigate(-1);
+                }}
+                visible={true}
                 formParams={{
                     days:1,
-                    clazzName: 'com.codingapi.example.domain.Leave',
+                    clazzName: 'com.codingapi.example.infra.flow.form.LeaveForm',
                     username: username
                 }}
             />
diff --git a/mobile-ui/src/pages/levave/detail.tsx b/mobile-ui/src/pages/levave/detail.tsx
index 21c27556..d836238d 100644
--- a/mobile-ui/src/pages/levave/detail.tsx
+++ b/mobile-ui/src/pages/levave/detail.tsx
@@ -1,7 +1,7 @@
 import React from "react";
 import Header from "@/layout/Header";
 import {useLocation} from "react-router";
-import Descriptions from "@/components/descriptions";
+import {Descriptions} from "@codingapi/form-mobile";
 import {fields} from "@/pages/levave/fields";
 
 const LeaveDetailPage = () => {
diff --git a/mobile-ui/src/pages/levave/fields.ts b/mobile-ui/src/pages/levave/fields.ts
index 339bd74b..0dc6db2e 100644
--- a/mobile-ui/src/pages/levave/fields.ts
+++ b/mobile-ui/src/pages/levave/fields.ts
@@ -1,4 +1,4 @@
-import {FormField} from "@/components/form/types";
+import {FormField} from "@codingapi/ui-framework";
 
 export const fields = [
     {
diff --git a/mobile-ui/src/pages/levave/form.tsx b/mobile-ui/src/pages/levave/form.tsx
index 2041657e..575aac05 100644
--- a/mobile-ui/src/pages/levave/form.tsx
+++ b/mobile-ui/src/pages/levave/form.tsx
@@ -1,8 +1,8 @@
 import React, {useContext, useEffect} from "react";
-import Form from "@/components/form";
-import {FlowFormViewProps} from "@/components/flow/types";
+import {Form} from "@codingapi/form-mobile";
+import {FlowFormViewProps} from "@codingapi/ui-framework";
 import {Button, Toast} from "antd-mobile";
-import {FlowViewReactContext} from "@/components/flow/view";
+import {FlowViewReactContext} from "@codingapi/flow-mobile";
 import {fields} from "@/pages/levave/fields";
 
 const LeaveForm: React.FC<FlowFormViewProps> = (props) => {
diff --git a/mobile-ui/src/pages/login/index.tsx b/mobile-ui/src/pages/login/index.tsx
index 068a7fb3..cd09c11a 100644
--- a/mobile-ui/src/pages/login/index.tsx
+++ b/mobile-ui/src/pages/login/index.tsx
@@ -1,9 +1,7 @@
 import React from "react";
 import {Button, Toast} from "antd-mobile";
-import FormInput from "@/components/form/input";
-import FormPassword from "@/components/form/password";
+import {FormInput,FormPassword,Form} from "@codingapi/form-mobile";
 import {useNavigate} from "react-router";
-import Form from "@/components/form";
 import {initUser, login} from "@/api/account";
 import {config} from "@/config/theme";
 
diff --git a/mobile-ui/src/pages/person/education/custom.tsx b/mobile-ui/src/pages/person/education/custom.tsx
index 8df52777..0ac9f7f3 100644
--- a/mobile-ui/src/pages/person/education/custom.tsx
+++ b/mobile-ui/src/pages/person/education/custom.tsx
@@ -1,7 +1,6 @@
 import React from "react";
-import {SelectOptionFormEditProps} from "@/components/form/types";
-import Form from "@/components/form";
-import FormInput from "@/components/form/input";
+import {SelectOptionFormEditProps} from "@codingapi/ui-framework";
+import {FormInput,Form} from "@codingapi/form-mobile";
 
 const CustomFormEditOption:React.FC<SelectOptionFormEditProps> = (props)=>{
     return (
diff --git a/mobile-ui/src/pages/person/education/fields.tsx b/mobile-ui/src/pages/person/education/fields.tsx
index 0a6dae0b..cd46798c 100644
--- a/mobile-ui/src/pages/person/education/fields.tsx
+++ b/mobile-ui/src/pages/person/education/fields.tsx
@@ -1,4 +1,4 @@
-import {FormField} from "@/components/form/types";
+import {FormField} from "@codingapi/ui-framework";
 import CustomFormEditOption from "@/pages/person/education/custom";
 import OSSUtils from "@/utils/oss";
 
diff --git a/mobile-ui/src/pages/person/education/form.tsx b/mobile-ui/src/pages/person/education/form.tsx
index 88187621..383e5d76 100644
--- a/mobile-ui/src/pages/person/education/form.tsx
+++ b/mobile-ui/src/pages/person/education/form.tsx
@@ -5,7 +5,7 @@ import BasicInfo from "@/components/info/BasicInfo";
 import FormInfo from "@/components/info/FormInfo";
 import {Button, Toast} from "antd-mobile";
 import {loadFields} from "@/pages/person/education/fields";
-import Form from "@/components/form";
+import {Form} from "@codingapi/form-mobile";
 import {Grid} from "antd-mobile/es/components/grid/grid";
 
 const EducationForm = () => {
@@ -59,7 +59,7 @@ const EducationForm = () => {
 
                 <Button
                     onClick={() => {
-                        formInstance.validate();
+                        formInstance.validate().then();
                     }}
                 >校验字段</Button>
 
diff --git a/mobile-ui/src/pages/test/index.tsx b/mobile-ui/src/pages/test/index.tsx
index c3c15872..6545c67c 100644
--- a/mobile-ui/src/pages/test/index.tsx
+++ b/mobile-ui/src/pages/test/index.tsx
@@ -1,7 +1,7 @@
 import React from "react";
-import Form from "@/components/form";
+import {Form} from "@codingapi/form-mobile";
 import {Button, Modal} from "antd-mobile";
-import {FormField} from "@/components/form/types";
+import {FormField} from "@codingapi/ui-framework";
 
 const Test = () => {
 
diff --git a/mobile-ui/src/utils/dynamicLoader.ts b/mobile-ui/src/utils/dynamicLoader.ts
deleted file mode 100644
index f26908e2..00000000
--- a/mobile-ui/src/utils/dynamicLoader.ts
+++ /dev/null
@@ -1,108 +0,0 @@
-import JSZip from "jszip";
-import {base64ToBlob} from "@/utils/base64";
-
-export const loadRemoteComponent = (scope: string, module: string) => {
-    return new Promise(async (resolve, reject) => {
-        try {
-            // Initialize the sharing scope (shared modules like react, etc.)
-            //@ts-ignore
-            await __webpack_init_sharing__('default');
-            //@ts-ignore
-            const container = window[scope]; // Get the container loaded on the window object
-            if (!container) {
-                reject(new Error(`Remote scope ${scope} not found on window.`));
-                return;
-            }
-
-            //@ts-ignore
-            await container.init(__webpack_share_scopes__.default); // Initialize the container
-            const factory = await container.get(module); // Get the module factory
-            resolve(factory()); // Get the actual module
-        } catch (e) {
-            reject(e);
-        }
-    });
-};
-
-export const loadRemoteScript = (url: string): Promise<void> => {
-    return new Promise((resolve, reject) => {
-        try {
-            const script = document.createElement('script');
-            script.src = url;
-            script.onload = (e) => {
-                resolve();
-            };
-            script.onerror = reject;
-            document.head.appendChild(script);
-        } catch (e) {
-            reject(e);
-        }
-    });
-};
-
-
-export const loadFileScript = (content: string): Promise<void> => {
-    return new Promise((resolve, reject) => {
-        try {
-            try {
-                eval(content);
-            } catch (e) {
-                resolve();
-                return;
-            }
-            const encoder = new TextEncoder();
-            const encodedContent = encoder.encode(content);
-            const blob = new Blob([encodedContent], {type: 'application/javascript'});
-            const url = URL.createObjectURL(blob);
-            const script = document.createElement('script');
-            script.src = url;
-            script.onload = () => {
-                resolve();
-            };
-            script.onerror = (e) => {
-                reject(e);
-            };
-            document.head.appendChild(script);
-        } catch (e) {
-            reject(e);
-        }
-    });
-};
-
-
-export const loadZipJsFileScript = async (base64: string): Promise<void> => {
-    return new Promise((resolve, reject) => {
-        const file = base64ToBlob(base64, 'application/zip');
-        if (file) {
-            const zip = new JSZip();
-            const content = file.arrayBuffer();
-            zip.loadAsync(content).then((unzipped:any) => {
-                const jsFiles: { relativePath: string, content: string }[] = [];
-
-                const filePromises: Promise<void>[] = [];
-                unzipped.forEach((relativePath:any, file:any) => {
-                    if (relativePath.endsWith(".js")) {
-                        const filePromise = file.async('text').then((text:any) => {
-                            jsFiles.push({relativePath, content: text});
-                        });
-                        filePromises.push(filePromise);
-                    }
-                });
-
-                Promise.all(filePromises).then(() => {
-                    jsFiles.reduce((prevPromise: any, jsFile) => {
-                        return prevPromise.then(() => {
-                            return loadFileScript(jsFile.content).then(() => {
-                                console.log('Load success file:', jsFile.relativePath);
-                            });
-                        });
-                    }, Promise.resolve()).then(() => {
-                        resolve();
-                    }).catch(reject);
-                }).catch(reject);
-            }).catch(reject);
-        } else {
-            reject(new Error('Failed to convert base64 to Blob.'));
-        }
-    });
-};

From 046440d9149f3ff3f4cfc291a340ad698bb36ebc Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Mon, 28 Apr 2025 20:32:09 +0800
Subject: [PATCH 17/20] fix port

---
 admin-ui/webpack.common.js       | 2 +-
 mobile-ui/webpack.config.dev.js  | 2 +-
 mobile-ui/webpack.config.mock.js | 2 +-
 mobile-ui/webpack.config.prod.js | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/admin-ui/webpack.common.js b/admin-ui/webpack.common.js
index 061d285a..34dac02d 100644
--- a/admin-ui/webpack.common.js
+++ b/admin-ui/webpack.common.js
@@ -15,7 +15,7 @@ module.exports = {
         },
     ],
     devServer: {
-        port: 3000,
+        port: 8000,
     },
     resolve: {
         extensions: ['.ts', '.tsx', '.js'],
diff --git a/mobile-ui/webpack.config.dev.js b/mobile-ui/webpack.config.dev.js
index 409c3ab7..da1de853 100644
--- a/mobile-ui/webpack.config.dev.js
+++ b/mobile-ui/webpack.config.dev.js
@@ -4,7 +4,7 @@ const common = require('./webpack.common.js');
 module.exports = merge(common, {
     mode: 'development',
     devServer: {
-        port: 8000,
+        port: 3000,
         proxy: [
             {
                 context: ['/api', '/open', '/user'],
diff --git a/mobile-ui/webpack.config.mock.js b/mobile-ui/webpack.config.mock.js
index bff5caf1..d53c66ae 100644
--- a/mobile-ui/webpack.config.mock.js
+++ b/mobile-ui/webpack.config.mock.js
@@ -7,7 +7,7 @@ const express = require('express');
 module.exports = merge(common, {
     mode: 'development',
     devServer: {
-        port: 3050,
+        port: 3000,
 
         setupMiddlewares: (middlewares, devServer) => {
             if (!devServer) {
diff --git a/mobile-ui/webpack.config.prod.js b/mobile-ui/webpack.config.prod.js
index 90868278..bd1fb7c2 100644
--- a/mobile-ui/webpack.config.prod.js
+++ b/mobile-ui/webpack.config.prod.js
@@ -4,6 +4,6 @@ const common = require('./webpack.common.js');
 module.exports = merge(common,{
     mode: 'production',
     devServer: {
-        port: 13000,
+        port: 3000,
     },
 });

From 6e2e26858982e84015b454f69f94ac3e32b05ae7 Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Mon, 28 Apr 2025 21:15:15 +0800
Subject: [PATCH 18/20] add mirco for mobile

---
 mobile-ui/package.json                        |   2 +-
 mobile-ui/public/captcha.jpeg                 | Bin 0 -> 548 bytes
 mobile-ui/src/config/route.tsx                |  25 +-
 mobile-ui/src/gateway/default/Header.tsx      |  17 +
 mobile-ui/src/gateway/index.tsx               |   6 +
 mobile-ui/src/pages/form/index.tsx            | 572 ++++++++++++++++++
 mobile-ui/src/pages/home/index.tsx            |  17 +-
 mobile-ui/src/pages/mirco/index.tsx           | 102 ++++
 .../src/pages/person/education/custom.tsx     |  19 -
 .../src/pages/person/education/fields.tsx     | 423 -------------
 mobile-ui/src/pages/person/education/form.tsx | 178 ------
 .../src/pages/person/education/index.tsx      | 191 ------
 mobile-ui/src/pages/test/index.tsx            |  79 ---
 mobile-ui/webpack.common.js                   |   2 +-
 mobile-ui/webpack.config.dev.js               |   2 +-
 mobile-ui/webpack.config.mock.js              |   2 +-
 mobile-ui/webpack.config.prod.js              |   2 +-
 17 files changed, 726 insertions(+), 913 deletions(-)
 create mode 100644 mobile-ui/public/captcha.jpeg
 create mode 100644 mobile-ui/src/gateway/default/Header.tsx
 create mode 100644 mobile-ui/src/gateway/index.tsx
 create mode 100644 mobile-ui/src/pages/form/index.tsx
 create mode 100644 mobile-ui/src/pages/mirco/index.tsx
 delete mode 100644 mobile-ui/src/pages/person/education/custom.tsx
 delete mode 100644 mobile-ui/src/pages/person/education/fields.tsx
 delete mode 100644 mobile-ui/src/pages/person/education/form.tsx
 delete mode 100644 mobile-ui/src/pages/person/education/index.tsx
 delete mode 100644 mobile-ui/src/pages/test/index.tsx

diff --git a/mobile-ui/package.json b/mobile-ui/package.json
index f9f0b19b..81186dfa 100644
--- a/mobile-ui/package.json
+++ b/mobile-ui/package.json
@@ -5,7 +5,7 @@
   "dependencies": {
     "@babel/standalone": "^7.25.6",
     "@codingapi/flow-mobile": "^0.0.2",
-    "@codingapi/form-mobile": "^0.0.2",
+    "@codingapi/form-mobile": "^0.0.3",
     "@codingapi/ui-framework": "^0.0.12",
     "@logicflow/core": "^2.0.10",
     "@logicflow/extension": "^2.0.14",
diff --git a/mobile-ui/public/captcha.jpeg b/mobile-ui/public/captcha.jpeg
new file mode 100644
index 0000000000000000000000000000000000000000..7493088527606bac88775e696c7db8bed98c8f16
GIT binary patch
literal 548
zcmV+<0^9wGP)<h;3K|Lk000e1NJLTq004LZ001Zm0ssI2x`?TA0005&Nkl<ZcwX(+
zzfD6i5XbTKR7`+GPs0XTfDssj319&Rpo=J&gN_B5=7?g+aen@jyR)Bt@8Pemy5}?>
zSypy5led3A90#|>cDR`3bG}ky*Mz>3$JP1zWYE7KPj2wT=4yf)CWH2Q@r}7R_w^~E
zp;f!LdK}8NfreJ$-T^mk5opL1dS_o>59qK_mwlA4uQxQbsC%Esm)T%wsENBB+%Q|v
zkjUMpug^3z6uX;x9LlW;+UIfk_kDP4f-Ya)_`aLUI<)$6u;y+QT8CR`IJ!CLw!X=R
zTy}HN{p;gif_{8`#+9(I&l}F*&n~;ad%@MI@7ssu;5lL7{<D7z2T!xhLLZgg;0Iwb
zYdrXy%cRit)}d@Dj^`vT4qb?&OxK`so8R-Ryu8VVK{J(ULf6DsrU|W%`82z7%9IDq
z?fGp1TBJ-vp<(clurbiM&36?#Ie1i9tXyy16<VrHTIhOfsNT9Cv_hE}(6~KS_@u4@
zbP}{JwDf8A^@q-Z=Jw2bK&zGM|3Jf1ms*)dKvTvvx#V|-2G)3^YawOIYr1{%6SLUV
zZEB$@uny<)q$dAp6b642#DUHYo)+e1!@)z6&i^`^D-#d8V6BG6qpBJzQ{nHOh04(D
mYC?C)H1w95(4Cslo%#dcp&9o9TbAnp0000<MNUMnLSTYCy%&=J

literal 0
HcmV?d00001

diff --git a/mobile-ui/src/config/route.tsx b/mobile-ui/src/config/route.tsx
index 36e7150e..11db7c6d 100644
--- a/mobile-ui/src/config/route.tsx
+++ b/mobile-ui/src/config/route.tsx
@@ -5,14 +5,13 @@ import HomePage from "@/pages/home";
 import {Route} from "react-router";
 import {RouteObject} from "react-router/dist/lib/context";
 import React from "react";
-import EducationIndex from "@/pages/person/education";
-import EducationForm from "@/pages/person/education/form";
-import Test from "@/pages/test";
 import LeaveListPage from "@/pages/levave";
 import LeaveCreatePage from "@/pages/levave/create";
 import FlowListPage from "@/pages/flow";
 import FlowDetailPage from "@/pages/flow/detail";
 import LeaveDetailPage from "@/pages/levave/detail";
+import FormPage from "@/pages/form";
+import MircoPage from "@/pages/mirco";
 
 
 export const routes: RouteObject[] = [
@@ -20,10 +19,6 @@ export const routes: RouteObject[] = [
         path: "/login",
         element: <Login/>,
     },
-    {
-        path: "/test",
-        element: <Test/>,
-    },
     {
         path: '/',
         element: <Layout/>,
@@ -32,6 +27,14 @@ export const routes: RouteObject[] = [
                 path: "/",
                 element: <HomePage/>,
             },
+            {
+                path: "/form",
+                element: <FormPage/>,
+            },
+            {
+                path: "/mirco",
+                element: <MircoPage/>,
+            },
             {
                 path: "/leave/index",
                 element: <LeaveListPage/>,
@@ -52,14 +55,6 @@ export const routes: RouteObject[] = [
                 path: "/flow/detail",
                 element: <FlowDetailPage/>,
             },
-            {
-                path: "/person/education/index",
-                element: <EducationIndex/>,
-            },
-            {
-                path: "/person/education/form",
-                element: <EducationForm/>,
-            },
             {
                 path: '/*',
                 element: <NotFound/>,
diff --git a/mobile-ui/src/gateway/default/Header.tsx b/mobile-ui/src/gateway/default/Header.tsx
new file mode 100644
index 00000000..1d0356ad
--- /dev/null
+++ b/mobile-ui/src/gateway/default/Header.tsx
@@ -0,0 +1,17 @@
+import React from "react";
+import {HeaderProps} from "@/gateway";
+
+
+const HeaderDefault: React.FC<HeaderProps> = (props) => {
+    return (
+        <div>
+            <h1>{props.title}</h1>
+            <button onClick={props.onClick}>Click Me</button>
+            <div>
+                <span>PS:local default component</span>
+            </div>
+        </div>
+    )
+}
+
+export default HeaderDefault;
diff --git a/mobile-ui/src/gateway/index.tsx b/mobile-ui/src/gateway/index.tsx
new file mode 100644
index 00000000..a8fb44d1
--- /dev/null
+++ b/mobile-ui/src/gateway/index.tsx
@@ -0,0 +1,6 @@
+
+export interface HeaderProps{
+    title: string;
+    onClick: () => void;
+}
+
diff --git a/mobile-ui/src/pages/form/index.tsx b/mobile-ui/src/pages/form/index.tsx
new file mode 100644
index 00000000..36111758
--- /dev/null
+++ b/mobile-ui/src/pages/form/index.tsx
@@ -0,0 +1,572 @@
+import React from "react";
+import Header from "@/layout/Header";
+import {Button, Tabs, Toast} from "antd-mobile";
+import {
+    Form,
+    FormCaptcha,
+    FormCascader,
+    FormCheckbox,
+    FormDate,
+    FormInput,
+    FormPassword,
+    FormRadio,
+    FormRate,
+    FormSelect,
+    FormSlider,
+    FormStepper,
+    FormSwitch,
+    FormTextArea,
+    FormUploader
+} from "@codingapi/form-mobile";
+import {FormField, FormInstance} from "@codingapi/ui-framework";
+
+
+
+const FooterButtons: React.FC<{ formInstance: FormInstance }> = ({formInstance}) => {
+    const data = {
+        user: {
+            name: '张三',
+            age: 18,
+            password: '123456',
+            code: '123',
+            checkbox: '1,2',
+            radio: '1',
+            rate: 3,
+            slider: 50,
+            switch: true,
+            textarea: '这是一段文本',
+            date: '2021-08-01',
+            cascader: '1,1-1,1-1-1',
+            select: '1,2',
+            avatar: 'c84fb304c180f61bb7db40efef7f85b7',
+        }
+    }
+
+    return (
+        <div
+            style={{
+                display: "grid",
+                gridTemplateColumns: "1fr 1fr",
+                gridRowGap: "10px",
+                gridColumnGap: "10px"
+            }}
+        >
+            <Button
+                onClick={async () => {
+                    const name = formInstance.getFieldValue(["user", "name"])
+                    Toast.show(name);
+                }}
+            >获取姓名</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.setFieldValue(["user", "name"], "123")
+                }}
+            >设置姓名</Button>
+
+            <Button
+                onClick={async () => {
+                    await formInstance.validate();
+                }}
+            >验证表单</Button>
+
+            <Button
+                onClick={async () => {
+                    await formInstance.submit();
+                }}
+            >提交表单</Button>
+
+            <Button
+                onClick={async () => {
+                    const values = formInstance.getFieldsValue();
+                    Toast.show(JSON.stringify(values));
+                }}
+            >获取表单值</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.reset();
+                }}
+            >重置表单</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.setFieldsValue(data);
+                }}
+            >表单赋值</Button>
+            <div></div>
+
+            <Button
+                onClick={async () => {
+                    formInstance.enable(["user", "name"]);
+                }}
+            >启用姓名字段</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.disable(["user", "name"]);
+                }}
+            >禁用姓名字段</Button>
+
+
+            <Button
+                onClick={async () => {
+                    formInstance.hidden(["user", "name"]);
+                }}
+            >隐藏姓名字段</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.show(["user", "name"]);
+                }}
+            >展示姓名字段</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.remove(["user", "name"]);
+                }}
+            >删除姓名字段</Button>
+
+            <Button
+                onClick={async () => {
+                    formInstance.create({
+                        props: {
+                            required: true,
+                            name: ['user', 'name'],
+                            label: '姓名',
+                            placeholder: '请输入姓名',
+                            validateFunction: async (content) => {
+                                const value = content.value;
+                                if (value) {
+                                    return []
+                                }
+                                return ['姓名不能为空']
+                            }
+                        },
+                        type: 'input'
+                    }, 0);
+                }}
+            >添加姓名字段</Button>
+
+        </div>
+    )
+}
+
+const FormPage = ()=>{
+
+    const [activeKey, setActiveKey] = React.useState("property");
+
+    const leftFormInstance = Form.useForm();
+    const rightFormInstance = Form.useForm();
+
+    const fields = [
+        {
+            type: 'input',
+            props: {
+                required: true,
+                name: ['user', 'name'],
+                label: '姓名',
+                placeholder: '请输入姓名',
+                validateFunction: async (content) => {
+                    const value = content.value;
+                    if (value) {
+                        return []
+                    }
+                    return ['姓名不能为空']
+                }
+            }
+        },
+        {
+            type: 'stepper',
+            props: {
+                required: true,
+                name: ['user', 'age'],
+                label: '年龄',
+                placeholder: '请输入年龄',
+            }
+        },
+        {
+            type: 'password',
+            props: {
+                required: true,
+                name: ['user', 'password'],
+                label: '银行卡密码',
+                placeholder: '请输入银行卡密码',
+                validateFunction: async (content) => {
+                    const value = content.value;
+                    if (value) {
+                        return []
+                    }
+                    return ['银行卡密码不能为空']
+                }
+            }
+        },
+        {
+            type: 'captcha',
+            props: {
+                required: true,
+                name: ['user', 'code'],
+                label: '银行卡验证码',
+                placeholder: '请输入银行卡验证码',
+                onCaptchaRefresh: async () => {
+                    console.log('refresh captcha')
+                    return {
+                        url: '/captcha.jpeg',
+                        code: '123'
+                    }
+                }
+            }
+        },
+        {
+            type: 'checkbox',
+            props: {
+                required: true,
+                name: ['user', 'checkbox'],
+                label: '复选框',
+                options: [
+                    {label: '选项1', value: '1'},
+                    {label: '选项2', value: '2'},
+                    {label: '选项3', value: '3'},
+                ]
+            }
+        },
+        {
+            type: 'radio',
+            props: {
+                required: true,
+                name: ['user', 'radio'],
+                label: '单选框',
+                options: [
+                    {label: '选项1', value: '1'},
+                    {label: '选项2', value: '2'},
+                    {label: '选项3', value: '3'},
+                ]
+            }
+        },
+        {
+            type: 'rate',
+            props: {
+                required: true,
+                name: ['user', 'rate'],
+                label: '评分',
+            }
+        },
+        {
+            type: 'slider',
+            props: {
+                required: true,
+                name: ['user', 'slider'],
+                label: '滑块',
+                sliderPopover: true
+            }
+        },
+        {
+            type: 'switch',
+            props: {
+                required: true,
+                name: ['user', 'switch'],
+                label: '开关',
+            }
+        },
+        {
+            type: 'textarea',
+            props: {
+                required: true,
+                name: ['user', 'textarea'],
+                label: '文本域',
+            }
+        },
+        {
+            type: 'date',
+            props: {
+                required: true,
+                name: ['user', 'date'],
+                label: '日期',
+            }
+        },
+        {
+            type: 'cascader',
+            props: {
+                required: true,
+                name: ['user', 'cascader'],
+                label: '级联选择',
+                options: [
+                    {
+                        label: '选项1',
+                        value: '1',
+                        children: [
+                            {
+                                label: '选项1-1',
+                                value: '1-1',
+                                children: [
+                                    {
+                                        label: '选项1-1-1',
+                                        value: '1-1-1',
+                                    },
+                                    {
+                                        label: '选项1-1-2',
+                                        value: '1-1-2',
+                                    },
+                                ]
+                            },
+                            {
+                                label: '选项1-2',
+                                value: '1-2',
+                            },
+                        ]
+                    },
+                    {
+                        label: '选项2',
+                        value: '2',
+                        children: [
+                            {
+                                label: '选项2-1',
+                                value: '2-1',
+                            },
+                            {
+                                label: '选项2-2',
+                                value: '2-2',
+                            },
+                        ]
+                    },
+                ]
+            }
+        },
+        {
+            type: 'select',
+            props: {
+                required: true,
+                name: ['user', 'select'],
+                label: '选择器',
+                selectMultiple: true,
+                options: [
+                    {label: '选项1', value: '1'},
+                    {label: '选项2', value: '2'},
+                    {label: '选项3', value: '3'},
+                ]
+            }
+        },
+        {
+            type: 'uploader',
+            props: {
+                required: true,
+                name: ['user', 'avatar'],
+                label: '头像',
+            }
+        },
+    ] as FormField[];
+
+    return (
+        <>
+            <Header>Form表单</Header>
+            <Tabs
+                activeKey={activeKey}
+                onChange={(value)=>{
+                    setActiveKey(value);
+                }}
+            >
+                <Tabs.Tab title={"属性表单"} key={"property"}/>
+                <Tabs.Tab title={"字段表单"} key={"field"}/>
+            </Tabs>
+
+            {activeKey ==='field' && (
+                <>
+                    <Form
+                        layout={"horizontal"}
+                        form={rightFormInstance}
+                        footer={(
+                            <FooterButtons formInstance={rightFormInstance}/>
+                        )}
+                        loadFields={async () => {
+                            return fields;
+                        }}
+                    >
+                    </Form>
+                </>
+            )}
+
+            {activeKey ==='property' && (
+                <>
+                    <Form
+                        form={leftFormInstance}
+                        layout={"horizontal"}
+                        footer={(
+                            <FooterButtons
+                                formInstance={leftFormInstance}
+                            />
+                        )}
+                    >
+                        <FormInput
+                            required={true}
+                            name={["user", "name"]}
+                            label={"姓名"}
+                            placeholder={"请输入姓名"}
+                            validateFunction={async (content) => {
+                                const value = content.value;
+                                if (value) {
+                                    return []
+                                }
+                                return ['姓名不能为空']
+                            }}
+                        />
+
+                        <FormStepper
+                            required={true}
+                            name={["user", "age"]}
+                            label={"年龄"}
+                            placeholder={"请输入年龄"}
+                        />
+
+                        <FormPassword
+                            required={true}
+                            name={["user", "password"]}
+                            label={"银行卡密码"}
+                            placeholder={"请输入银行卡密码"}
+                            validateFunction={async (content) => {
+                                const value = content.value;
+                                if (value) {
+                                    return []
+                                }
+                                return ['银行卡密码不能为空']
+                            }}
+                        />
+
+                        <FormCaptcha
+                            required={true}
+                            name={["user", "code"]}
+                            label={"银行卡验证码"}
+                            placeholder={"请输入银行卡验证码"}
+                            onCaptchaRefresh={async () => {
+                                console.log('refresh captcha')
+                                return {
+                                    url: '/captcha.jpeg',
+                                    code: '123'
+                                }
+                            }}
+                        />
+
+                        <FormCheckbox
+                            required={true}
+                            name={["user", "checkbox"]}
+                            label={"复选框"}
+                            options={[
+                                {label: '选项1', value: '1'},
+                                {label: '选项2', value: '2'},
+                                {label: '选项3', value: '3'},
+                            ]}
+                        />
+
+                        <FormRadio
+                            required={true}
+                            name={["user", "radio"]}
+                            label={"单选框"}
+                            options={[
+                                {label: '选项1', value: '1'},
+                                {label: '选项2', value: '2'},
+                                {label: '选项3', value: '3'},
+                            ]}
+                        />
+
+                        <FormRate
+                            required={true}
+                            name={["user", "rate"]}
+                            label={"评分"}
+                        />
+
+                        <FormSlider
+                            required={true}
+                            name={["user", "slider"]}
+                            label={"滑块"}
+                            sliderPopover={true}
+                        />
+
+                        <FormSwitch
+                            required={true}
+                            name={["user", "switch"]}
+                            label={"开关"}
+                        />
+
+                        <FormTextArea
+                            required={true}
+                            name={["user", "textarea"]}
+                            label={"文本域"}
+                        />
+
+                        <FormDate
+                            required={true}
+                            name={["user", "date"]}
+                            label={"日期"}
+                        />
+
+                        <FormCascader
+                            required={true}
+                            name={["user", "cascader"]}
+                            label={"级联选择"}
+                            options={[
+                                {
+                                    label: '选项1',
+                                    value: '1',
+                                    children: [
+                                        {
+                                            label: '选项1-1',
+                                            value: '1-1',
+                                            children: [
+                                                {
+                                                    label: '选项1-1-1',
+                                                    value: '1-1-1',
+                                                },
+                                                {
+                                                    label: '选项1-1-2',
+                                                    value: '1-1-2',
+                                                },
+                                            ]
+                                        },
+                                        {
+                                            label: '选项1-2',
+                                            value: '1-2',
+                                        },
+                                    ]
+                                },
+                                {
+                                    label: '选项2',
+                                    value: '2',
+                                    children: [
+                                        {
+                                            label: '选项2-1',
+                                            value: '2-1',
+                                        },
+                                        {
+                                            label: '选项2-2',
+                                            value: '2-2',
+                                        },
+                                    ]
+                                },
+                            ]}
+                        />
+
+                        <FormSelect
+                            required={true}
+                            name={["user", "select"]}
+                            label={"选择器"}
+                            selectMultiple={true}
+                            options={[
+                                {label: '选项1', value: '1'},
+                                {label: '选项2', value: '2'},
+                                {label: '选项3', value: '3'},
+                            ]}
+                        />
+
+                        <FormUploader
+                            required={true}
+                            name={["user", "avatar"]}
+                            label={"头像"}
+                        />
+
+                    </Form>
+                </>
+            )}
+        </>
+    )
+}
+
+export default FormPage;
diff --git a/mobile-ui/src/pages/home/index.tsx b/mobile-ui/src/pages/home/index.tsx
index bb2c61a2..efa4a9ae 100644
--- a/mobile-ui/src/pages/home/index.tsx
+++ b/mobile-ui/src/pages/home/index.tsx
@@ -42,9 +42,20 @@ const HomePage = () => {
                             width:"100%"
                         }}
                         onClick={() => {
-                            navigate("/person/education/index")
+                            navigate("/form")
                         }}
-                    >教育信息</Button>
+                    >表单</Button>
+                </Grid.Item>
+
+                <Grid.Item>
+                    <Button
+                        style={{
+                            width:"100%"
+                        }}
+                        onClick={() => {
+                            navigate("/mirco")
+                        }}
+                    >微前端</Button>
                 </Grid.Item>
 
                 <Grid.Item>
@@ -55,7 +66,7 @@ const HomePage = () => {
                         onClick={() => {
                             navigate("/leave/index")
                         }}
-                    >请假</Button>
+                    >请假管理</Button>
                 </Grid.Item>
 
 
diff --git a/mobile-ui/src/pages/mirco/index.tsx b/mobile-ui/src/pages/mirco/index.tsx
new file mode 100644
index 00000000..b9a65e87
--- /dev/null
+++ b/mobile-ui/src/pages/mirco/index.tsx
@@ -0,0 +1,102 @@
+import React, {useState} from "react";
+import {Button, Space, Toast} from "antd-mobile";
+import {Access, ComponentBus} from "@codingapi/ui-framework";
+import {HeaderProps} from "@/gateway";
+import HeaderDefault from "@/gateway/default/Header";
+import Header from "@/layout/Header";
+import {Form, FormInput} from "@codingapi/form-mobile";
+import Popup from "@/components/popup";
+
+
+const MircoPage = () => {
+
+    // 用于重新渲染界面
+    const [pageVersion, setPageVersion] = useState(0);
+
+    const [visible, setVisible] = useState(false);
+
+    const HeaderKey = "Header";
+    const HeaderComponent = ComponentBus.getInstance().getComponent<HeaderProps>(HeaderKey, HeaderDefault);
+
+    const form = Form.useForm();
+
+    const refreshPage = ()=>{
+        setPageVersion(Math.random());
+    }
+
+    const handlerLoadComponent = async (values: any) => {
+        const {remoteUrl, scope, module} = values;
+        ComponentBus.getInstance()
+            .registerRemoteComponent(HeaderKey, remoteUrl, scope, module)
+            .catch(error=>{
+                console.error("load remote component error", error);
+                Toast.show('load remote component error');
+            })
+            .finally(() => {
+                setVisible(false);
+                refreshPage();
+            });
+    }
+
+    return (
+        <>
+            <Header>微前端</Header>
+
+            <Space>
+                <Button onClick={() => {
+                    form.setFieldsValue({
+                        remoteUrl: "http://localhost:3000/remoteEntry.js",
+                        scope: "MircoApp",
+                        module: "./Header"
+                    })
+                    setVisible(true);
+                }}>load remote component</Button>
+
+                <Access hasRoles={['admin']}>
+                    <Button onClick={() => {
+                        ComponentBus.getInstance().removeComponent(HeaderKey);
+                        refreshPage();
+                    }}>remove remote component</Button>
+                </Access>
+            </Space>
+
+            {HeaderComponent && (
+                <HeaderComponent
+                    title={"Remote Component Header"}
+                    onClick={() => {
+                        alert('click');
+                    }}
+                />
+            )}
+
+            <Popup
+                bodyStyle={{
+                    height: '60vh',
+                }}
+                title={"加载远程组件"}
+                visible={visible}
+                setVisible={setVisible}
+                onOk={async ()=>{
+                    await form.submit();
+                }}
+                onCancel={()=>{
+                    setVisible(false);
+                }}
+            >
+                <Form
+                    form={form}
+                    layout={"horizontal"}
+                    onFinish={async (values)=>{
+                        await handlerLoadComponent(values);
+                    }}
+                >
+                    <FormInput name={"remoteUrl"} label={"远程地址"}/>
+                    <FormInput name={"scope"} label={"作用域"}/>
+                    <FormInput name={"module"} label={"模块"}/>
+                </Form>
+            </Popup>
+        </>
+    )
+}
+
+export default MircoPage;
diff --git a/mobile-ui/src/pages/person/education/custom.tsx b/mobile-ui/src/pages/person/education/custom.tsx
deleted file mode 100644
index 0ac9f7f3..00000000
--- a/mobile-ui/src/pages/person/education/custom.tsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import React from "react";
-import {SelectOptionFormEditProps} from "@codingapi/ui-framework";
-import {FormInput,Form} from "@codingapi/form-mobile";
-
-const CustomFormEditOption:React.FC<SelectOptionFormEditProps> = (props)=>{
-    return (
-        <Form
-            form={props.currentInstance}
-        >
-            <FormInput
-                name={"type"}
-                label={"学科类别"}
-                placeholder={"请输入学科类别"}
-            />
-        </Form>
-    )
-}
-
-export default CustomFormEditOption;
diff --git a/mobile-ui/src/pages/person/education/fields.tsx b/mobile-ui/src/pages/person/education/fields.tsx
deleted file mode 100644
index cd46798c..00000000
--- a/mobile-ui/src/pages/person/education/fields.tsx
+++ /dev/null
@@ -1,423 +0,0 @@
-import {FormField} from "@codingapi/ui-framework";
-import CustomFormEditOption from "@/pages/person/education/custom";
-import OSSUtils from "@/utils/oss";
-
-export const loadFields = async (state: any, setState: (state: any) => void) => {
-    return [
-        {
-            type: 'input',
-            props: {
-                name: 'name',
-                label: '姓名',
-                placeholder: '请输入姓名',
-                inputMaxLength: 10,
-                required: true,
-                validateFunction: async (content) => {
-                    if (content.value) {
-                        return [];
-                    } else {
-                        return ["姓名不能为空"];
-                    }
-                },
-                onChange: (value, form) => {
-                    setState({
-                        ...state,
-                        name: value
-                    })
-                    form?.setFieldValue('type', 'Shuxue');
-                    form?.reloadOptions('type');
-                }
-            },
-        },
-        {
-            type: 'uploader',
-            props: {
-                name: 'avatar',
-                label: '头像',
-                placeholder: '请输入头像',
-                help: '上传头像信息',
-                onUploaderLoad:OSSUtils.loadFile,
-                onUploaderUpload:OSSUtils.uploadFile
-            },
-        },
-        {
-            type: 'select',
-            props: {
-                name: "type",
-                label: '学科类别',
-                placeholder: '请输入学科类别',
-                selectMultiple: false,
-                selectOptionFormEditable: true,
-                selectOptionFormEditView: CustomFormEditOption,
-                onSelectOptionFormFinish: (formAction, selectOptionFormEditFormAction,
-                                           reloadOption, close) => {
-                    const values = selectOptionFormEditFormAction.getFieldsValue();
-                    console.log('values', values);
-                    const type = values['type'];
-                    formAction.setFieldValue('type', type);
-                    close && close();
-                },
-                loadOptions: async (form) => {
-                    const name = form?.getFieldValue('name');
-                    if (name) {
-                        return [
-                            {
-                                label: '数学',
-                                value: 'Shuxue',
-                            },
-                            {
-                                label: '哲学',
-                                value: 'Zhexue',
-                            },
-                            {
-                                label: '计算机',
-                                value: 'JiSuanJi',
-                            }
-                        ]
-                    }
-                    return [
-                        {
-                            label: '哲学',
-                            value: 'Zhexue',
-                        },
-                        {
-                            label: '计算机',
-                            value: 'JiSuanJi',
-                        }
-                    ]
-                },
-                validateFunction: async (content) => {
-                    const value = content.form.getFieldValue('type');
-                    console.log('validateFunction type value', content.value, value);
-                    if (content.value && content.value.length > 0) {
-                        return [];
-                    } else {
-                        return ["学科类别不能为空"];
-                    }
-                }
-            }
-        },
-        {
-            type: 'select',
-            props: {
-                name: "major",
-                label: '专业名称',
-                placeholder: '请输入专业名称',
-                selectMultiple: true,
-                loadOptions: async (form) => {
-                    const name = form?.getFieldValue('name');
-                    return [
-                        {
-                            label: '大学',
-                            value: 'Unit',
-                            children: [
-                                {
-                                    label: '北京大学',
-                                    value: 'Beijing',
-                                    children: [
-                                        {
-                                            label: '清华大学',
-                                            value: 'singHua',
-                                            children: [
-                                                {
-                                                    label: '清华大学1',
-                                                    value: 'singHua1'
-                                                },
-                                                {
-                                                    label: '北京大学2',
-                                                    value: 'beiDa1',
-                                                    children: [
-                                                        {
-                                                            label: '清华大学11',
-                                                            value: 'singHua11'
-                                                        },
-                                                        {
-                                                            label: '北京大学21',
-                                                            value: 'beiDa11',
-                                                            children: [
-                                                                {
-                                                                    label: '清华大学111',
-                                                                    value: 'singHua111'
-                                                                },
-                                                                {
-                                                                    label: '北京大学211',
-                                                                    value: 'beiDa111',
-                                                                    children: [
-                                                                        {
-                                                                            label: '清华大学311',
-                                                                            value: 'singHua311'
-                                                                        },
-                                                                        {
-                                                                            label: '北京大学321',
-                                                                            value: 'beiDa311'
-                                                                        }
-                                                                    ]
-                                                                }
-                                                            ]
-                                                        },
-                                                    ]
-                                                }
-                                            ]
-                                        },
-                                        {
-                                            label: '北京大学',
-                                            value: 'beiDa'
-                                        }
-                                    ]
-                                }
-                            ]
-                        }
-                    ]
-                }
-
-            }
-        },
-        {
-            type: 'date',
-            props: {
-                name: "date",
-                label: '入学日期',
-                placeholder: '请输入入学日期',
-                onChange: (value, form) => {
-                    console.log('value', value);
-                    const name = form?.getFieldValue('name');
-                    console.log('name', name);
-                },
-                validateFunction: async (content) => {
-                    if (content.value) {
-                        return [];
-                    } else {
-                        return ["入学日期不能为空"];
-                    }
-                }
-            }
-        },
-        {
-            type: 'date',
-            props: {
-                name: "year",
-                label: '入学年份',
-                dateFormat: 'YYYY',
-                datePrecision: 'year',
-                placeholder: '请输入入学年份',
-                onChange: (value, form) => {
-                    console.log('value', value);
-                    const name = form?.getFieldValue('name');
-                    console.log('name', name);
-                }
-            }
-        },
-        {
-            type: 'radio',
-            props: {
-                name: "sex",
-                label: '性别',
-                placeholder: '请输入性别',
-                options: [
-                    {
-                        label: '男',
-                        value: 1
-                    },
-                    {
-                        label: '女',
-                        value: 0
-                    }
-                ],
-                validateFunction: async (content) => {
-                    if (content.value || content.value === 0) {
-                        return [];
-                    } else {
-                        return ["性别不能为空"];
-                    }
-                }
-            }
-        },
-        {
-            type: 'textarea',
-            props: {
-                name: "desc",
-                label: '简介',
-                placeholder: '请输入简介',
-                textAreaRows: 3,
-                validateFunction: async (content) => {
-                    if (content.value) {
-                        return [];
-                    } else {
-                        return ["简介不能为空"];
-                    }
-                }
-            }
-        },
-        {
-            type: 'switch',
-            props: {
-                name: "memory",
-                label: '婚姻状态',
-                placeholder: '是否结婚',
-                switchCheckText: '已婚',
-                switchUnCheckText: '未婚',
-                validateFunction: async (content) => {
-                    if (content.value !== undefined) {
-                        return [];
-                    } else {
-                        return ["婚姻状态不能为空"];
-                    }
-                }
-            }
-        },
-        {
-            type: 'checkbox',
-            props: {
-                name: "hobby",
-                label: '爱好',
-                placeholder: '请输入爱好',
-                options: [
-                    {
-                        label: '篮球',
-                        value: "1"
-                    },
-                    {
-                        label: '足球',
-                        value: "0"
-                    }
-                ],
-                validateFunction: async (content) => {
-                    if (content.value !== undefined) {
-                        if (content.value.length == 0) {
-                            return ["爱好不能为空"];
-                        }
-                        return [];
-                    } else {
-                        return ["爱好不能为空"];
-                    }
-                }
-            }
-        },
-        {
-            type: 'stepper',
-            props: {
-                name: "age",
-                label: '年龄',
-                validateFunction: async (content) => {
-                    if (content.value !== undefined) {
-                        return [];
-                    } else {
-                        return ["年龄不能为空"];
-                    }
-                }
-            }
-        },
-        {
-            type: 'slider',
-            props: {
-                name: "slider",
-                label: '喜欢的温度',
-                sliderMinNumber: 0,
-                sliderMaxNumber: 100,
-                sliderTicks: true,
-                sliderPopover: true,
-                sliderMarks: {
-                    0: 0,
-                    20: 20,
-                    40: 40,
-                    60: 60,
-                    80: 80,
-                    100: 100,
-                },
-                validateFunction: async (content) => {
-                    if (content.value !== undefined) {
-                        return [];
-                    } else {
-                        return ["喜欢的温度不能为空"];
-                    }
-                }
-            }
-        },
-        {
-            type: 'rate',
-            props: {
-                name: "movie",
-                label: '电影评价',
-                validateFunction: async (content) => {
-                    if (content.value !== undefined) {
-                        return [];
-                    } else {
-                        return ["电影评价不能为空"];
-                    }
-                }
-            }
-        },
-        {
-            type: 'selector',
-            props: {
-                name: "selector",
-                label: '电影偏好',
-                selectorColumn: 2,
-                selectorMultiple: true,
-                options: [
-                    {
-                        label: '动作',
-                        value: 'action',
-                    },
-                    {
-                        label: '喜剧',
-                        value: 'comedy',
-                    },
-                    {
-                        label: '爱情',
-                        value: 'love',
-                    },
-                    {
-                        label: '科幻',
-                        value: 'sci-fi',
-                    },
-                ],
-                validateFunction: async (content) => {
-                    if (content.value !== undefined) {
-                        return [];
-                    } else {
-                        return ["电影偏好不能为空"];
-                    }
-                }
-            }
-        },
-        {
-            type: 'cascader',
-            props: {
-                name: "location",
-                label: '所在地区',
-                validateFunction: async (content) => {
-                    if (content.value !== undefined) {
-                        return [];
-                    } else {
-                        return ["电影评价不能为空"];
-                    }
-                },
-                loadOptions: async (form) => {
-                    return [
-                        {
-                            label: "山东",
-                            value: "Shandong",
-                            children: [
-                                {
-                                    label: "济南",
-                                    value: "Jinan"
-                                }
-                            ]
-                        },
-                        {
-                            label: "广东",
-                            value: "Guangdong",
-                            children: [
-                                {
-                                    label: "广州",
-                                    value: "Guangzhou"
-                                }
-                            ]
-                        }
-                    ]
-                }
-            }
-        },
-    ] as FormField[];
-}
diff --git a/mobile-ui/src/pages/person/education/form.tsx b/mobile-ui/src/pages/person/education/form.tsx
deleted file mode 100644
index 383e5d76..00000000
--- a/mobile-ui/src/pages/person/education/form.tsx
+++ /dev/null
@@ -1,178 +0,0 @@
-import React from "react";
-import Header from "@/layout/Header";
-import {useLocation} from "react-router";
-import BasicInfo from "@/components/info/BasicInfo";
-import FormInfo from "@/components/info/FormInfo";
-import {Button, Toast} from "antd-mobile";
-import {loadFields} from "@/pages/person/education/fields";
-import {Form} from "@codingapi/form-mobile";
-import {Grid} from "antd-mobile/es/components/grid/grid";
-
-const EducationForm = () => {
-    const location = useLocation();
-    const item = location.state;
-    // console.log('items:', item);
-
-    const formInstance = Form.useForm();
-
-    const [state,setState] = React.useState({
-        name:"",
-        age:1
-    });
-
-    return (
-        <>
-            <Header>教育信息维护 {state.name} | {state.age}</Header>
-            <BasicInfo/>
-            <FormInfo
-                layout={"vertical"}
-                form={formInstance}
-                title={"教育信息"}
-                loadFields={async ()=>{
-                    return loadFields(state,setState);
-                }}
-                onFinish={async (values) => {
-                    const json = JSON.stringify(values);
-                    Toast.show(json);
-                }}
-            />
-
-            <Grid columns={2} gap={[8, 8]}>
-                <Button
-                    onClick={async () => {
-                        await formInstance.submit();
-                    }}
-                >提交</Button>
-
-                <Button
-                    onClick={() => {
-                        formInstance.reset();
-                    }}
-                >重置</Button>
-
-                <Button
-                    onClick={() => {
-                        const values = formInstance.getFieldsValue();
-                        console.log(values);
-                    }}
-                >获取所有值</Button>
-
-                <Button
-                    onClick={() => {
-                        formInstance.validate().then();
-                    }}
-                >校验字段</Button>
-
-                <Button
-                    onClick={() => {
-                        formInstance.required("type",true);
-                    }}
-                >学科类别必填</Button>
-
-                <Button
-                    onClick={() => {
-                        formInstance.required("type",false);
-                    }}
-                >学科类别非必填</Button>
-
-                <Button
-                    onClick={() => {
-                        formInstance.hidden("name");
-                    }}
-                >隐藏姓名</Button>
-
-
-                <Button
-                    onClick={() => {
-                        formInstance.show("name");
-                    }}
-                >展示姓名</Button>
-
-                <Button
-                    onClick={() => {
-                        formInstance.disable("name");
-                    }}
-                >禁用姓名</Button>
-
-                <Button
-                    onClick={() => {
-                        formInstance.enable("name");
-                    }}
-                >启用姓名</Button>
-
-                <Button
-                    onClick={() => {
-                        const name = formInstance.getFieldValue('name');
-                        Toast.show(name);
-                    }}
-                >获取姓名</Button>
-
-                <Button
-                    onClick={() => {
-                        formInstance.setFieldValue('name', '123123');
-                    }}
-                >设置姓名</Button>
-
-                <Button
-                    onClick={() => {
-                        formInstance.remove("name");
-                    }}
-                >删除姓名</Button>
-
-                <Button
-                    onClick={() => {
-                        formInstance.create({
-                            type: 'input',
-                            props: {
-                                name: 'name',
-                                label: '姓名',
-                                placeholder: '请输入姓名',
-                                validateFunction: (content) => {
-                                    return new Promise<string[]>((resolve) => {
-                                        if (content.value) {
-                                            resolve([]);
-                                        } else {
-                                            resolve(["姓名不存在"]);
-                                        }
-                                    })
-                                }
-                            },
-                        }, 0);
-                    }}
-                >添加姓名</Button>
-
-                <Button
-                    onClick={() => {
-                        formInstance.reset({
-                            name: '张三',
-                            avatar: 'c84fb304c180f61bb7db40efef7f85b7,c84fb304c180f61bb7db40efef7f85b7',
-                            type: 'Zhexue',
-                            major: 'Unit',
-                            date: '2023-12-21',
-                            year: '2023',
-                            sex: 1,
-                            desc: '123123',
-                            hobby: "1,0",
-                            memory: true,
-                            age: 24,
-                            slider: 50,
-                            movie: 4,
-                            selector: 'action,comedy',
-                            location: 'Shandong,Jinan'
-                        });
-                    }}
-                >数据回显</Button>
-
-                <Button
-                    onClick={() => {
-                        formInstance.validate().then(flag => {
-                            Toast.show(flag ? "校验成功" : "校验失败");
-                        });
-                    }}
-                >校验表单</Button>
-            </Grid>
-        </>
-    )
-}
-
-export default EducationForm;
diff --git a/mobile-ui/src/pages/person/education/index.tsx b/mobile-ui/src/pages/person/education/index.tsx
deleted file mode 100644
index acbfc873..00000000
--- a/mobile-ui/src/pages/person/education/index.tsx
+++ /dev/null
@@ -1,191 +0,0 @@
-import React from "react";
-import Header from "@/layout/Header";
-import {PullToRefreshTodoList,TodoListItem} from "@/components/info/List";
-import {useNavigate} from "react-router";
-import Footer from "@/layout/Footer";
-import {Button} from "antd-mobile";
-
-const EducationIndex = () => {
-    const navigate = useNavigate();
-
-    const data = [
-        {
-            id: 1,
-            state: 'done',
-            attrs:{
-                '学历': '大学本科',
-                '类别': '全日制教育',
-                '日期': '2021.9~2024.7',
-            },
-        },
-        {
-            id: 2,
-            state: 'un_submit',
-            attrs: {
-                '学历': '硕士研究生',
-                '类别': '全日制教育',
-                '日期': '2024.9~2026.7',
-            }
-        },
-        {
-            id: 3,
-            state: 'todo',
-            attrs: {
-                '学历': '博士研究生',
-                '类别': '全日制教育',
-                '日期': '2026.9~2030.7',
-            }
-        },
-        {
-            id: 4,
-            state: 'un_submit',
-            attrs: {
-                '学历': '博士研究生',
-                '类别': '全日制教育',
-                '日期': '2026.9~2030.7',
-            }
-        },
-        {
-            id: 5,
-            state: 'un_submit',
-            attrs: {
-                '学历': '博士研究生',
-                '类别': '全日制教育',
-                '日期': '2026.9~2030.7',
-            }
-        },
-        {
-            id: 6,
-            state: 'un_submit',
-            attrs: {
-                '学历': '博士研究生',
-                '类别': '全日制教育',
-                '日期': '2026.9~2030.7',
-            }
-        },
-        {
-            id: 7,
-            state: 'un_submit',
-            attrs: {
-                '学历': '博士研究生',
-                '类别': '全日制教育',
-                '日期': '2026.9~2030.7',
-            }
-        },
-        {
-            id: 8,
-            state: 'un_submit',
-            attrs: {
-                '学历': '大学本科',
-                '类别': '全日制教育',
-                '日期': '2021.9~2024.7',
-            }
-        },
-        {
-            id: 9,
-            state: 'un_submit',
-            attrs: {
-                '学历': '硕士研究生',
-                '类别': '全日制教育',
-                '日期': '2024.9~2026.7',
-            }
-        },
-        {
-            id: 10,
-            state: 'un_submit',
-            attrs: {
-                '学历': '博士研究生',
-                '类别': '全日制教育',
-                '日期': '2026.9~2030.7',
-            }
-        },
-        {
-            id: 11,
-            state: 'un_submit',
-            attrs: {
-                '学历': '博士研究生',
-                '类别': '全日制教育',
-                '日期': '2026.9~2030.7',
-            }
-        },
-        {
-            id: 12,
-            state: 'un_submit',
-            attrs: {
-                '学历': '博士研究生',
-                '类别': '全日制教育',
-                '日期': '2026.9~2030.7',
-            }
-        },
-        {
-            id: 13,
-            state: 'un_submit',
-            attrs: {
-                '学历': '博士研究生',
-                '类别': '全日制教育',
-                '日期': '2026.9~2030.7',
-            }
-        },
-        {
-            id: 14,
-            state: 'un_submit',
-            attrs: {
-                '学历': '博士研究生',
-                '类别': '全日制教育',
-                '日期': '2026.9~2030.7',
-            }
-        },
-    ] as TodoListItem[];
-
-    return (
-        <>
-            <Header>教育信息</Header>
-            <PullToRefreshTodoList
-                showDetail={()=>{
-                    return true;
-                }}
-                showDelete={()=>{
-                    return true;
-                }}
-                showEdit={()=>{
-                    return true;
-                }}
-                onRefresh={async ()=>{
-                    return {
-                        data:{
-                            total: data.length,
-                            list: data
-                        },
-                        success:true
-                    }
-                }}
-                onLoadMore={async ()=>{
-                    return {
-                        data:{
-                            total: data.length,
-                            list: data
-                        },
-                        success:true
-                    }
-                }}
-                onEditClick={(item)=>{
-                    navigate('/person/education/form', {state: item})
-                }}
-            />
-            <Footer>
-                <Button
-                    block={true}
-                    color='primary'
-                    size={'middle'}
-                    style={{
-                        margin:'15%'
-                    }}
-                >
-                    新增教育信息
-                </Button>
-            </Footer>
-        </>
-    )
-}
-
-export default EducationIndex;
diff --git a/mobile-ui/src/pages/test/index.tsx b/mobile-ui/src/pages/test/index.tsx
deleted file mode 100644
index 6545c67c..00000000
--- a/mobile-ui/src/pages/test/index.tsx
+++ /dev/null
@@ -1,79 +0,0 @@
-import React from "react";
-import {Form} from "@codingapi/form-mobile";
-import {Button, Modal} from "antd-mobile";
-import {FormField} from "@codingapi/ui-framework";
-
-const Test = () => {
-
-    const [visible, setVisible] = React.useState(false);
-    const fields = [
-        {
-            type: "input",
-            props: {
-                label: "请假天数",
-                name: "days",
-                required: true,
-                validateFunction: async (content) => {
-                    if (content.value <= 0) {
-                        return ["请假天数不能小于0"];
-                    }
-                    return []
-                }
-            }
-        },
-        {
-            type: "textarea",
-            props: {
-                label: "请假理由",
-                name: "desc",
-                required: true,
-                validateFunction: async (content) => {
-                    if (content.value && content.value.length > 0) {
-                        return []
-                    }
-                    return ["请假理由不能为空"];
-                }
-            }
-        }
-    ] as FormField[];
-
-    const formInstance = Form.useForm();
-
-
-    return (
-        <div>
-            <div style={{
-                display:'flex',
-                justifyItems:'center',
-                justifyContent:'center',
-            }}>
-                <Button
-                    onClick={()=>{
-                        formInstance.setFieldValue('desc','123');
-                        setVisible(true);
-                    }}
-                >show form</Button>
-            </div>
-
-            <Modal
-                visible={visible}
-                closeOnMaskClick={true}
-                title={"Form表单测试"}
-                onClose={() => {
-                    setVisible(false)
-                }}
-                closeOnAction={true}
-                content={(
-                    <Form
-                        form={formInstance}
-                        loadFields={async ()=>{
-                            return fields
-                        }}
-                    />
-                )}
-            />
-        </div>
-    )
-}
-
-export default Test
diff --git a/mobile-ui/webpack.common.js b/mobile-ui/webpack.common.js
index e3fd4e7d..8aeb1056 100644
--- a/mobile-ui/webpack.common.js
+++ b/mobile-ui/webpack.common.js
@@ -15,7 +15,7 @@ module.exports = {
         },
     ],
     devServer: {
-        port: 3000,
+        port: 10000,
     },
     resolve: {
         extensions: ['.ts', '.tsx', '.js'],
diff --git a/mobile-ui/webpack.config.dev.js b/mobile-ui/webpack.config.dev.js
index da1de853..b5667d1d 100644
--- a/mobile-ui/webpack.config.dev.js
+++ b/mobile-ui/webpack.config.dev.js
@@ -4,7 +4,7 @@ const common = require('./webpack.common.js');
 module.exports = merge(common, {
     mode: 'development',
     devServer: {
-        port: 3000,
+        port: 10000,
         proxy: [
             {
                 context: ['/api', '/open', '/user'],
diff --git a/mobile-ui/webpack.config.mock.js b/mobile-ui/webpack.config.mock.js
index d53c66ae..80bd232b 100644
--- a/mobile-ui/webpack.config.mock.js
+++ b/mobile-ui/webpack.config.mock.js
@@ -7,7 +7,7 @@ const express = require('express');
 module.exports = merge(common, {
     mode: 'development',
     devServer: {
-        port: 3000,
+        port: 10000,
 
         setupMiddlewares: (middlewares, devServer) => {
             if (!devServer) {
diff --git a/mobile-ui/webpack.config.prod.js b/mobile-ui/webpack.config.prod.js
index bd1fb7c2..686523b1 100644
--- a/mobile-ui/webpack.config.prod.js
+++ b/mobile-ui/webpack.config.prod.js
@@ -4,6 +4,6 @@ const common = require('./webpack.common.js');
 module.exports = merge(common,{
     mode: 'production',
     devServer: {
-        port: 3000,
+        port: 10000,
     },
 });

From 2746a494f7d01291789d2dc8a7b965e899c3109f Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Mon, 28 Apr 2025 21:23:32 +0800
Subject: [PATCH 19/20] update form mobile version

---
 mobile-ui/package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/mobile-ui/package.json b/mobile-ui/package.json
index 81186dfa..899a3ac0 100644
--- a/mobile-ui/package.json
+++ b/mobile-ui/package.json
@@ -4,7 +4,7 @@
   "private": true,
   "dependencies": {
     "@babel/standalone": "^7.25.6",
-    "@codingapi/flow-mobile": "^0.0.2",
+    "@codingapi/flow-mobile": "^0.0.3",
     "@codingapi/form-mobile": "^0.0.3",
     "@codingapi/ui-framework": "^0.0.12",
     "@logicflow/core": "^2.0.10",

From 31f0860c39f691dd96b292b8b953c626a336df9a Mon Sep 17 00:00:00 2001
From: lorne <1991wangliang@gmail.com>
Date: Mon, 28 Apr 2025 21:24:24 +0800
Subject: [PATCH 20/20] fix gitignore

---
 admin-ui/.gitignore  | 2 +-
 mobile-ui/.gitignore | 1 +
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/admin-ui/.gitignore b/admin-ui/.gitignore
index f46b1022..e2f83bb3 100644
--- a/admin-ui/.gitignore
+++ b/admin-ui/.gitignore
@@ -25,4 +25,4 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 yarn.lock
-
+package-lock.json
diff --git a/mobile-ui/.gitignore b/mobile-ui/.gitignore
index f46b1022..5d207c84 100644
--- a/mobile-ui/.gitignore
+++ b/mobile-ui/.gitignore
@@ -25,4 +25,5 @@ npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
 yarn.lock
+package-lock.json