https://github.com/StavinLi/Workflow

仿钉钉审批流程设置
https://github.com/StavinLi/Workflow

Last synced: about 1 year ago
JSON representation

仿钉钉审批流程设置

• Host: GitHub
• URL: https://github.com/StavinLi/Workflow
• Owner: StavinLi
• License: mit
• Created: 2019-11-12T03:29:34.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2024-11-08T07:25:38.000Z (over 1 year ago)
• Last Synced: 2025-05-03T23:02:05.033Z (about 1 year ago)
• Language: Vue
• Homepage: http://stavinli.gitee.io/workflow/#/approval/setting
• Size: 3.08 MB
• Stars: 1,566
• Watchers: 32
• Forks: 380
• Open Issues: 5
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          


### workflow钉钉审批流程设置

workflow钉钉审批流程设置，基于vue开发。 QQ交流群①:639251756  QQ交流群②:790780565

![在这里插入图片描述](https://img-blog.csdnimg.cn/20191116144905578.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzM3Mjg1MTkz,size_16,color_FFFFFF,t_70 )

-  [开源地址vue2版本 https://github.com/StavinLi/Workflow](https://github.com/StavinLi/Workflow) github点个星吧！

-  [开源地址vue3版本 https://github.com/StavinLi/Workflow-Vue3](https://github.com/StavinLi/Workflow-Vue3) github点个星吧！

-  [开源地址react版本 https://github.com/StavinLi/Workflow-React](https://github.com/StavinLi/Workflow-React) github点个星吧！

-  [预览地址 https://stavinli.github.io/Workflow/dist/index.html#/](https://stavinli.github.io/Workflow/dist/index.html#/) 

-------------------

 

#### 项目介绍

- UI钉钉风格

- 技术点

1. 组件自调用+递归处理，按树状结局处理审批流程问题

- 主要功能点

2. 界面缩放

![在这里插入图片描述](https://img-blog.csdnimg.cn/20191116145339223.jpg)

```javascript



	


    {{nowVal}}%

    




```

3. 节点设置（包括审批人、发起人、抄送人、条件设置）

![在这里插入图片描述](https://img-blog.csdnimg.cn/20200304140232374.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzM3Mjg1MTkz,size_16,color_FFFFFF,t_70#pic_center)

```javascript

 

    


        


            


                

                    指定成员

                    主管

                    发起人自选

                    发起人自己

                    连续多级主管

                

                ...

```

5. 节点新增

![在这里插入图片描述](https://img-blog.csdnimg.cn/20191116145355289.png)

```javascript



    

          


              

                  


                      

                  

                  
审批人

              

              

                  


                      

                  

                  
抄送人

              

              

                  


                      

                  

                  
条件分支

              

          

          ...

```

5.错误校验

![在这里插入图片描述](https://img-blog.csdnimg.cn/20200304140011896.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L20wXzM3Mjg1MTkz,size_16,color_FFFFFF,t_70)

```javascript

let {type,error,nodeName,conditionNodes} = childNode

if (type == 1 || type == 2) {

    if (error) {

        this.tipList.push({ name: nodeName, type: ["","审核人","抄送人"][type] })

    }

    this.reErr(childNode)

} else if (type == 3) {

    this.reErr(childNode)

} else if (type == 4) {

    this.reErr(childNode)

    for (var i = 0; i < conditionNodes.length; i++) {

        if (conditionNodes[i].error) {

            this.tipList.push({ name: conditionNodes[i].nodeName, type: "条件" })

        }

        this.reErr(conditionNodes[i])

    }

}

```

6.模糊搜索匹配人员、职位、角色

```javascript


```

#### 项目安装

> git clone https://github.com/StavinLi/Workflow.git 点个赞吧！

#### 项目运行 **node14**

> 1.环境依赖    `npm i`

> 2.本地运行 `npm run serve` 

> 3.打包运行 `npm run build`