# van

**Repository Path**: liyongi/van

## Basic Information

- **Project Name**: van
- **Description**: springboot + bpmnjs + flowable/activiti/camunda + form-design + rbac + vue + vue3 + element-plus 工作流低代码实战项目
- **Primary Language**: TypeScript
- **License**: MIT
- **Default Branch**: dev
- **Homepage**: https://admin.l1yp.com/
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 31
- **Created**: 2024-05-26
- **Last Updated**: 2024-05-26

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 一. 3分钟上手

## 1. [点我](https://admin.l1yp.com/process/model)  → 创建流程模型
![wf-models.png](docs%2Fget-started%2Fimages%2Fwf-models.png)

## 2. 配置流程字段
> 双击流程模型进入配置界面

![wf-fields.png](docs%2Fget-started%2Fimages%2Fwf-fields.png)

## 3. 设计流程图
> 创建流程模型后会默认创建一个初始的流程图V1，双击流程图版本即可进入设计

![wf-diagram-designer.png](docs%2Fget-started%2Fimages%2Fwf-diagram-designer.png)

## 4. 发布流程图
![wf-ver-publish.png](docs%2Fget-started%2Fimages%2Fwf-ver-publish.png)

## 5. 配置流程实例列表
> 流程实例列表是系统抽象的，可通过配置实现，无需单独开发。

### 5.1 创建菜单TAB容器
![page-container.png](docs%2Fget-started%2Fimages%2Fpage-container.png)

### 5.2 创建 流程列表 页面
![wf-tab.png](docs%2Fget-started%2Fimages%2Fwf-tab.png)

## 5.3 配置流程实例列表视图
> 流程列表视图: 配置展示哪些字段，哪些字段需要筛选、排序等

![wf-view-cfg.png](docs%2Fget-started%2Fimages%2Fwf-view-cfg.png)

## 6. 效果展示
![preview.png](docs%2Fget-started%2Fimages%2Fpreview.png)


# 二、基于角色实现的字段级表达式权限管理

## 2.1 选择角色
![roles.png](docs%2Fget-started%2Fimages%2Froles.png)

## 2.2 选择流程 & 权限表达式配置
![perm-expr.png](docs%2Fget-started%2Fimages%2Fperm-expr.png)


> 大家在使用本项目时，推荐结合贺波老师的书[《深入Activiti流程引擎：核心原理与高阶实战》](https://item.m.jd.com/product/13928958.html?gx=RnAomTM2bmCImZxDqYAkVCoIHuIYVqc)，这本书对系统学习和深入掌握Activiti/Flowable的用法非常有帮助。

![book-thumb.jpg](docs%2Fimages%2Fbook-thumb.jpg)