Comprehensive Guide to the Workflow Management System: Framework, Features, Process Design, and Operations

Framework Overview

Framework

Version

Notes

SpringBoot

2.3.7.RELEASE

Web framework

Mybatis-Plus

3.5.2

ORM framework

sa-token

1.35.0.RC

Permission authentication

Hutool

5.8.4

Utility library

knife4j

2.0.7

API documentation

spring-file-storage

0.7.0

File upload

tlog

1.5.1

Log recording

easypoi

4.2.0

Excel import/export

minio

8.4.3

File storage

xx-job

2.4.0

Distributed task scheduling

Feature List

System Settings (e.g., sync route list, authorize menus, member management, role impersonation, password reset, role authorization, user management, role management, menu management, front‑end routing, department management, position management, data dictionary, parameter configuration, system logs, system notifications)

Workflow (e.g., agree, reject, return to previous step, return to initiator, jump, delegate, copy, etc.)

Process Design

Add

Click the "Add" button at the top‑left of the list to create a new process design; only basic information is required.

Field description:

Display Name – the name shown in the process list.

Unique Code – the identifier that matches the process definition name.

Process Category – e.g., vacation management, HR, finance, legal, administration, business, others (configured via data dictionary).

Icon – selectable from the system icon set.

Remarks.

View

Click the "View" button on the right side of a row.

The view contains two tabs: Process Diagram and Process Data.

Process Diagram

Process Data

Edit

Click the "Edit" button on the right side of a row to modify basic information.

Design

Click the "Design" button on the right side of a row to open the process designer.

Process Designer

The designer consists of three main parts: Drag Panel, Canvas, Property Panel, and a Control Panel.

Drag Panel

The left‑hand menu lists node models that can be dragged onto the canvas.

Node items include:

Start Node – model StartModel

User Task – model TaskModel

Custom Task – model CustomModel

Decision – model DecisionModel

Fork – model ForkModel

Join – model JoinModel

End Node – model EndModel

Snaker Sub‑process – model SubProcessModel (independent definition)

Sub‑process – model SubProcessModel (embedded in parent process)

Canvas

The canvas provides WYSIWYG editing with zoom, drag, move, connect, node/edge editing, and right‑click menus.

Zoom with Ctrl + mouse wheel.

Drag nodes directly.

Move canvas via mouse wheel or click‑drag.

Connect nodes by dragging.

Edit node properties via the property panel.

Edit edge properties via the edge panel.

Right‑click for context menus (delete, canvas settings, etc.).

Property Panel

When a node, edge, or the canvas is right‑clicked, a corresponding property panel opens for editing.

Start Node

Task Node

Custom Task Node

Decision Node

Fork Node

Join Node

End Node

Sub‑process Node

Control Panel

The control panel is located in the upper‑right corner.

Menu items include zoom out, zoom in, fit, previous step, next step, clear canvas, view (JSON/XML), import, highlight, save, etc.

Form Design

Click the "Form Design" button (ellipsis menu) to design forms. Only metadata‑driven forms support online design; custom‑coded forms are preview‑only.

Custom Development Form

Developed by developers as a .vue file.

Metadata Form

Generated from JSON metadata and rendered dynamically.

Form Attributes

Configure attributes such as title and layout.

Add Field

Sort Fields

Use "Move Up" / "Move Down" to reorder.

Edit Field

Delete Field

Save

Click the "Confirm" button to submit changes to the backend.

Deployment

Click the "Deploy" button (ellipsis menu) to generate a new process definition version.

Process Definition

Process definitions store workflow engine files synchronized from the designer. Deploy and redeploy actions affect versioning.

Fields include Display Name, Unique Code, Category, Version (auto‑increment on deploy), and Status (enabled/disabled).

View

Similar to designer view, showing diagram and data (JSON from LogicFlow, XML from SnakerFlow).

Initiate

Click the "Initiate" button (ellipsis menu) to open the start form; after filling, the process begins.

Different processes may have slightly different start forms, controlled by the "Instance Start Form" field.

Enable/Disable

Use the "Enable" or "Disable" button (ellipsis menu) to toggle the definition.

Delete

Use the "Delete" button (ellipsis menu) to remove a process definition; this does not affect already deployed instances.

My Initiated Processes

The list groups process definitions and shows only the latest version.

My Initiated

Shows the list of processes you have started.

Details

Click "Details" to view Form, Diagram, and Approval Records (three tabs).

Form

Read‑only view of the submitted form.

Diagram

Shows highlighted nodes for completed, in‑progress, and pending steps.

Approval Records

Displayed as a timeline or a table.

Withdraw

Two ways to withdraw an ongoing process: via the "Withdraw" button in the row menu or by selecting the checkbox.

My To‑Do

Shows tasks assigned to you when the workflow reaches a node you are responsible for.

Handle

Click "Handle" to open the approval detail, which includes Form, Diagram, and Approval Records.

Form

Same as the read‑only form in "My Initiated" details.

Diagram

Same as the diagram view in "My Initiated" details.

Approval Records

Same as the approval records view in "My Initiated" details.

Operation Area

Bottom section with input fields and action buttons.

Ordinary task buttons: Agree (proceed to next node), Reject (end process), Return to Previous Step, Return to Initiator, Jump (to historical node).

Counter‑sign task buttons: Agree, Disagree, Add Sign (add participants without advancing).

Delegate

Click "Delegate" to select an agent; after confirmation, the agent sees the delegated tasks.

My Completed

Lists tasks you have finished.

My CC

Shows processes CC'd to you; you have view‑only permission.

Source Code

Backend project, frontend project, demo address, and login credentials (admin/123456). Click "Read Original" for the source repository.