# caipig_workflow

> caipig_workflow TypeScript 构建前端工作流【定义、执行】小工具

Latest version **1.0.6** (published 2023-09-02) · ISC license · 0 weekly downloads

## Install

```sh
npm install caipig_workflow
pnpm add caipig_workflow
yarn add caipig_workflow
bun add caipig_workflow
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.6 |
| Published | 2023-09-02 |
| First published | 2023-09-02 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 0 |
| Unpacked size | 35.8 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | caipig |
| Maintainers | caipig |
| Keywords | 前端工作流, 流程管理 |

## Links

- npm: https://www.npmjs.com/package/caipig_workflow
- npm.io page: https://npm.io/package/caipig_workflow

## Recent versions

- 1.0.6 (latest) — 2023-09-02
- 1.0.5 — 2023-09-02
- 1.0.4 — 2023-09-02
- 1.0.3 — 2023-09-02
- 1.0.2 — 2023-09-02
- 1.0.1 — 2023-09-02
- 1.0.0 — 2023-09-02

## README

<p align="center"></p>
<h1 align="center" style="margin: 30px 0 30px; font-weight: bold;">caipig_workflow</h1>
<h4 align="center">TypeScript 构建前端工作流【定义、执行】小工具</h4>


#### 前往npm

```
https://www.npmjs.com/package/caipig_workflow?activeTab=readme
```

---

#### 新建项目并初始化

1.  创建vite项目

```
npm init vite-app 项目名称
```

2.  安装依赖，初始化项目

```
cd 项目
```

```
npm install
```

---

#### 使用说明

1.  安装依赖

```
npm i caipig_workflow
```

2. 在vue文件中引入依赖

```html
<template>

</template>

<script lang="ts" setup>
import {workFlow} from 'caipig_workflow/index.ts'

</script>

<style scoped>

</style>
```

---

#### 目录说明
~~~
utils    
├── config.ts             // 全局配置文件
├── event.ts              // 事件（开始事件 || 任务事件 || 结束事件）
├── gateway.ts            // 网关（并行网关 || 互斥网关）
├── index.ts              // 组件入口
├── listener.ts           // 监视器（开始监视器 || 任务监视器 || 结束监视器...）
├── node.ts               // 流程节点（初始化、构建、执行）
├── utils.ts              // 工具类（生成uuid、遍历流程节点）
~~~

---

#### 流程定义说明

> 流程工厂：负责流程的定义、构建、执行

```js
// 获取一个流程定义工厂实例
workFlow.WorkFlowFactory.getInstance()

// 构架下一节点信息
workFlow.WorkFlowFactory.getInstance().appendNextNode(下一节点)

// 结束构建流程节点
workFlow.WorkFlowFactory.getInstance().builder()

// 执行定义的流程
workFlow.WorkFlowFactory.getInstance().start()
```

> 下一节点：组装父节点跳转到下一节点的判断条件，以及下一节点的内容

```
// 获取一个下一节点的实例
workFlow.NextNode.getInstance(跳转条件，子节点)

// 获取一个下一节点的实例
workFlow.NextNode.getInstance(
	/**
	 * 获取跳转到下一节点的条件监视器实例
	 *
	 * 支持类型：
	 *      1.方法类型
	 *      2.表达式类型
	 */
	// workFlow.FunctionConditionListener.getInstance(),
	workFlow.ExpressionConditionListener.getInstance(),
	
	workFlow.WorkFlowFactory.getInstance()
)


注意：如果跳转下一节点的判断条件执行结果返回为true，则跳转到下一节点，否则不执行
```

> 事件：开始事件、结束事件、任务事件

```
在这里事件用于充当节点使用！！！

// 获取一个开始事件实例
workFlow.StartEvent.getInstance()

// 获取一个结束事件实例
workFlow.EndEvent.getInstance()

// 获取一个任务事件实例
workFlow.TaskEvent.getInstance()
```

> 网关：并行网关、互斥网关

```
// 获取一个并行网关实例
workFlow.ParallelGateway.getInstance()

// 获取一个并行网关实例，并添加两个个于此连接的节点
workFlow.ParallelGateway.getInstance().appendGatewayListener(跳转判断条件，节点)
workFlow.ParallelGateway.getInstance().appendGatewayListener(workFlow.TaskListener.getFunctionTaskListener(),workFlow.WorkFlowFactory.getInstance())

// 获取一个互斥网关实例
workFlow.ExclusiveGateway.getInstance()

// 获取一个互斥网关实例，并添加两个个于此连接的节点
workFlow.ExclusiveGateway.getInstance().appendGatewayListener(跳转判断条件，节点)
workFlow.ExclusiveGateway.getInstance().appendGatewayListener(workFlow.TaskListener.getFunctionTaskListener(),workFlow.WorkFlowFactory.getInstance())

注意：appendGatewayListener（），如果添加的监视器类型为workFlow.TaskListener.getFunctionTaskListener()或者workFlow.TaskListener.getExpressionTaskListener()才会为建立该网关 ---> 下一节点连接（多个workFlow.TaskListener...则建立多个连接），否则不会建立连接
```




---

#### 构建流程

> 定义一个简单的流程，并执行该流程！


```
定义一个简单流程：开始节点 ---> 任务节点 ---> 结束节点
```


```html
<template>

</template>

<script lang="ts" setup>
import {workFlow} from 'caipig_workflow/index.ts'


// 获取一个流程定义工厂实例（用于构建流程）
const workFlowFactory = workFlow.WorkFlowFactory.getInstance()

// 链式编程：构建下一节点的信息
// workFlowFactory.appendNextNode(下一节点信息)

workFlowFactory.appendNextNode(
	/**
	 * 获取一个下一节点的实例
	 *
	 * 入参：
	 *  1.条件监视器：方法类型、表达式类型
	 *           1.1 返回结果未true，则跳转到下一节点
	 *           1.2 返回结果未false，则不跳转
	 *  2.节点
	 */
	workFlow.NextNode.getInstance(
		workFlow.FunctionConditionListener.getInstance(null,() => {
			console.log('条件监视器：返回true则走到下一节点，否则不执行')
			
			return true;
		}),
		
		// 不传递传输则默认为start类型的节点！！！！！
		// workFlow.WorkFlowFactory.getInstance()
		
		workFlow.WorkFlowFactory.getInstance(
			
			// 获取一个任务事件的实例
			workFlow.TaskEvent.getInstance('执行指定任务...')
				
				// 添加一个监视器
				.appendEventListener(
					
					// 添加一个前置监视器
					workFlow.StartListener.getFunctionStartListener(null,() => {
						console.log('前置监视器...')
					})
				).appendEventListener(
				
				// 添加一个后置监视器
				workFlow.EndListener.getFunctionEndListener(null,() => {
					console.log('后置监视器...')
				})
			).appendEventListener(
				
				// 添加一个任务监视器
				workFlow.TaskListener.getFunctionTaskListener(null,() => {
					console.log('任务监视器...')
					console.log('执行任务中...')
				})
			)
		)
	)
)


// 构建结束
workFlowFactory.builder()


// 执行定义的流程
workFlowFactory.start();
</script>

<style scoped>

</style>
```

---
_Source: https://npm.io/package/caipig_workflow · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._