我在起前面的幾篇隨筆中，大概介紹了工作流的一些場景化處理，包括如何把具體業務表單組件化，並在查看和編輯界面中，動態加載組件內容，以及對於查看申請單的主頁面，把審批、取消、發起會簽、會簽、批示分閱、閱辦等處理過程的進行模塊化，並在主頁面中靈活引入集成，本篇隨筆綜合性的介紹Vue&Element開發框架中增加的工作流各個管理界面的內容，以供參考交流。
1、工作流模塊化划分
為了更有效的維護和管理工作流的設置和申請單信息，我們把工作流的內容分為三個大部分：工作流維護、工作流業務、業務表單。
工作流維護，主要是工作流模板的管理，包括流程模板的管理、以及流程環節的管理
工作流業務，主要是根據系統模板，提供創建流程申請單的入口（業務受理列表），我的審批工作（當前用戶），所有審批工作（管理員維護），我的草稿（當前用戶）
業務表單，這是根據具體表單的信息，提供查詢統計的處理，包括各類業務表單，如付款申請單、物品領用單等等。
這些工作流的業務菜單如下所示。
2、流程環節管理
我們要開始一項工作流的申請單，首先需要配置好這個申請單的一些基本信息，其中流程環節就是決定每個步驟執行那種處理類型（如審批、撤銷）的，因此流程環節也算是最基本的步驟類型定義了，也就是決定針對這類型的步驟的統一處理界面。
里面預定義了一些如審批、歸檔、會簽、閱辦等系統性的步驟類型，還可以根據需要自定義處理類型，自定義處理類型后，我們創建對應的處理規則即可在查看詳細申請的界面中進行調用處理。
3、流程模板管理
完成了流程步驟類型的定義，就可以開始流程模板的管理了，流程模板主要配置相關工作流的信息，如表單的分類，對應數據表，流程步驟定義和順序等等。
流程步驟的界面管理如下所示，可以通過雙擊修改，拖動調整順序的方式管理各個步驟的信息。
編輯界面中，實現對流程模板的一些信息進行維護，如下所示。
最終，我們根據以上界面完成了流程模板和流程實例，以及相關步驟的設置處理，如下圖所示。
4、業務受理列表
我們完成了流程模板，對於啟用的流程模板，我們提供給用戶創建具體的流程實例申請單，也就是提供創建流程申請單的入口。
由於我們約定了模板的名稱和具體申請單的關系，因此查看申請單和編輯申請單的時候，使用的是同一個路由地址頁面，而根據傳入參數的不同，動態展示組件信息，供查看或者編輯處理。
但我們創建具體的表單的時候，根據表單的編輯界面，錄入不同的流程申請單的數據，以及附件、清單、流程用戶等信息。
對於主從表單的處理，我們可以通過利用Vxe-table插件的方式直接錄入數據的方式進行錄入 。
5、我的審批工作
我的審批工作，主要是根據當前用戶列出不同類型（我發起的、我的待辦、我的已辦）等不同狀態的申請單，從而可以快速處理自己的工作流審批業務工作。
通過雙擊行記錄或者單擊查看按鈕，可以打開詳細的申請單信息進行處理。
查看申請單中，會根據申請單的狀態，以及當前用戶的身份等等，自動展示可以操作流程的按鈕。
其中流程日志展示相關的流程日志和系統日志等信息，供參考了解。
系統日志信息，則詳細記錄每個步驟的創建和處理信息。如在用戶完成當前步驟的時候，自動創建新的流程步驟信息的日志。
6、所有審批工作
為了方便管理員查看不同的業務表單，以便核對處理或者刪除等操作，我們提供了一個管理界面，可以看到所有申請單的記錄信息，同時記錄提供刪除操作，刪除申請單的時候，會把該申請單的相關步驟信息，執行用戶信息，對應表單記錄等信息一並抹除。
7、我的草稿
為了便於在創建申請單的時候暫存草稿信息，我們提供了一個通用的草稿存儲表，用於存儲任何信息的申請單信息。
在申請單創建界面里面，在末尾都會提供一個【保存草稿】的按鈕，如下所示。
草稿的管理界面如下所示。
單擊編輯按鈕，可以對該草稿進行編輯，以便恢復到之前的錄入狀態。
8、業務表單
業務表單則是提供對具體類型的申請單數據進行查看，如下菜單所示。
這樣不同的表單，有不同的查詢界面，可以提供更加進行的業務表單數據查詢或者統計處理。
