11# @flow-engine/flow-core
22
3- Flow Engine 前端核心库,提供与后端 API 交互的基础功能 。
3+ Flow Engine 前端核心框架库,提供 HTTP 客户端、Hooks、Presenter 等基础能力(不包含 UI 组件) 。
44
55## 简介
66
7- ` flow-core ` 是 Flow Engine 的核心前端库,包含:
7+ ` flow-core ` 是 Flow Engine 的核心框架库,提供与 UI 无关的基础能力:
88
9- - HTTP 客户端封装 (基于 axios)
10- - API 服务接口定义
11- - 通用类型和工具函数
9+ - HTTP 客户端封装(基于 axios)
10+ - React Hooks 工具
11+ - Presenter 模式实现
12+ - 通用工具函数
13+ - 全局状态管理
1214
13- ### 核心依赖
15+ ### 依赖关系
1416
15- - ` axios ` - HTTP 客户端
16- - ` react ` + ` react-dom ` - React 框架
17+ - ** 依赖** : 无
1718
1819## Setup
1920
@@ -39,25 +40,92 @@ pnpm run dev
3940
4041## 核心功能
4142
42- ### API 服务
43+ ### HTTP 客户端
4344
44- 提供与 Flow Engine 后端交互的 API 接口 :
45+ 基于 axios 封装的 HTTP 客户端,提供 :
4546
46- - 流程定义 API
47- - 流程实例 API
48- - 待办/已办 API
49- - 流程操作 API
47+ - 请求拦截器/响应拦截器
48+ - 统一的错误处理
49+ - 类型安全的请求/响应
50+ - 请求取消支持
5051
51- ### HTTP 客户端
52+ ``` typescript
53+ import { httpClient } from ' @flow-engine/flow-core' ;
5254
53- 基于 axios 封装的 HTTP 客户端,支持:
55+ // GET 请求
56+ const workflow = await httpClient .get <Workflow >(' /api/workflows/1' );
5457
55- - 请求拦截
56- - 响应拦截
57- - 错误处理
58- - 类型安全的请求/响应
58+ // POST 请求
59+ const result = await httpClient .post <Workflow >(' /api/workflows' , workflowData );
60+ ```
61+
62+ ### React Hooks
63+
64+ 提供常用的业务 Hooks:
65+
66+ - ` useWorkflow ` - 工作流相关操作
67+ - ` useFlowRecord ` - 流程记录相关操作
68+ - ` useApproval ` - 审批相关操作
69+ - 自定义 Hooks 工具
70+
71+ ### Presenter 模式
72+
73+ 实现业务逻辑与 UI 分离的 Presenter 模式:
74+
75+ ``` typescript
76+ import { Presenter } from ' @flow-engine/flow-core' ;
77+
78+ class WorkflowPresenter extends Presenter {
79+ async loadWorkflow(id : string ): Promise <Workflow > {
80+ // 加载工作流
81+ }
82+
83+ async saveWorkflow(workflow : Workflow ): Promise <void > {
84+ // 保存工作流
85+ }
86+ }
87+ ```
88+
89+ ### 工具函数
90+
91+ 提供通用工具函数:
92+
93+ - 日期格式化
94+ - 字符串处理
95+ - 对象深拷贝
96+ - 类型判断
97+
98+ ## 模块结构
99+
100+ ```
101+ flow-core/
102+ ├── src/
103+ │ ├── http/ # HTTP 客户端
104+ │ ├── hooks/ # React Hooks
105+ │ ├── presenter/ # Presenter 基类
106+ │ ├── utils/ # 工具函数
107+ │ └── types/ # 基础类型定义
108+ └── README.md
109+ ```
110+
111+ ## 使用示例
112+
113+ ``` typescript
114+ import { httpClient , useWorkflow , WorkflowPresenter } from ' @flow-engine/flow-core' ;
115+
116+ // 使用 HTTP 客户端
117+ const workflows = await httpClient .get <Workflow []>(' /api/workflows' );
118+
119+ // 使用 Hooks
120+ const { data, loading, error } = useWorkflow (' wf-001' );
121+
122+ // 使用 Presenter
123+ const presenter = new WorkflowPresenter ();
124+ await presenter .loadWorkflow (' wf-001' );
125+ ```
59126
60127## Learn more
61128
62129- [ Rslib documentation] ( https://lib.rsbuild.io/ ) - Rslib 特性和 API
63130- [ Flow Engine Docs] ( https://github.com/codingapi/flow-engine ) - 完整文档
131+ - [ CLAUDE.md] ( ../../CLAUDE.md ) - 开发指南
0 commit comments