自动化接口填充以及初始化数据制作

server/api/v1/wk_process.go

@@ -0,0 +1,130 @@
+package v1
+
+import (
+	"fmt"
+	"gin-vue-admin/global/response"
+	"gin-vue-admin/model"
+	"gin-vue-admin/model/request"
+	resp "gin-vue-admin/model/response"
+	"gin-vue-admin/service"
+	"github.com/gin-gonic/gin"
+)
+
+// @Tags WorkflowProcess
+// @Summary 创建WorkflowProcess
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body model.WorkflowProcess true "创建WorkflowProcess"
+// @Success 200 {string} string "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /workflowProcess/createWorkflowProcess [post]
+func CreateWorkflowProcess(c *gin.Context) {
+	var workflowProcess model.WorkflowProcess
+	_ = c.ShouldBindJSON(&workflowProcess)
+	err := service.CreateWorkflowProcess(workflowProcess)
+	if err != nil {
+		response.FailWithMessage(fmt.Sprintf("创建失败，%v", err), c)
+	} else {
+		response.OkWithMessage("创建成功", c)
+	}
+}
+
+// @Tags WorkflowProcess
+// @Summary 删除WorkflowProcess
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body model.WorkflowProcess true "删除WorkflowProcess"
+// @Success 200 {string} string "{"success":true,"data":{},"msg":"删除成功"}"
+// @Router /workflowProcess/deleteWorkflowProcess [delete]
+func DeleteWorkflowProcess(c *gin.Context) {
+	var workflowProcess model.WorkflowProcess
+	_ = c.ShouldBindJSON(&workflowProcess)
+	err := service.DeleteWorkflowProcess(workflowProcess)
+	if err != nil {
+		response.FailWithMessage(fmt.Sprintf("删除失败，%v", err), c)
+	} else {
+		response.OkWithMessage("删除成功", c)
+	}
+}
+
+// @Tags WorkflowProcess
+// @Summary 批量删除WorkflowProcess
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body request.IdsReq true "批量删除WorkflowProcess"
+// @Success 200 {string} string "{"success":true,"data":{},"msg":"删除成功"}"
+// @Router /workflowProcess/deleteWorkflowProcessByIds [delete]
+func DeleteWorkflowProcessByIds(c *gin.Context) {
+	var IDS request.IdsReq
+	_ = c.ShouldBindJSON(&IDS)
+	err := service.DeleteWorkflowProcessByIds(IDS)
+	if err != nil {
+		response.FailWithMessage(fmt.Sprintf("删除失败，%v", err), c)
+	} else {
+		response.OkWithMessage("删除成功", c)
+	}
+}
+
+// @Tags WorkflowProcess
+// @Summary 更新WorkflowProcess
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body model.WorkflowProcess true "更新WorkflowProcess"
+// @Success 200 {string} string "{"success":true,"data":{},"msg":"更新成功"}"
+// @Router /workflowProcess/updateWorkflowProcess [put]
+func UpdateWorkflowProcess(c *gin.Context) {
+	var workflowProcess model.WorkflowProcess
+	_ = c.ShouldBindJSON(&workflowProcess)
+	err := service.UpdateWorkflowProcess(&workflowProcess)
+	if err != nil {
+		response.FailWithMessage(fmt.Sprintf("更新失败，%v", err), c)
+	} else {
+		response.OkWithMessage("更新成功", c)
+	}
+}
+
+// @Tags WorkflowProcess
+// @Summary 用id查询WorkflowProcess
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body model.WorkflowProcess true "用id查询WorkflowProcess"
+// @Success 200 {string} string "{"success":true,"data":{},"msg":"查询成功"}"
+// @Router /workflowProcess/findWorkflowProcess [get]
+func FindWorkflowProcess(c *gin.Context) {
+	var workflowProcess model.WorkflowProcess
+	_ = c.ShouldBindQuery(&workflowProcess)
+	err, reworkflowProcess := service.GetWorkflowProcess(workflowProcess.ID)
+	if err != nil {
+		response.FailWithMessage(fmt.Sprintf("查询失败，%v", err), c)
+	} else {
+		response.OkWithData(gin.H{"reworkflowProcess": reworkflowProcess}, c)
+	}
+}
+
+// @Tags WorkflowProcess
+// @Summary 分页获取WorkflowProcess列表
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body request.WorkflowProcessSearch true "分页获取WorkflowProcess列表"
+// @Success 200 {string} string "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /workflowProcess/getWorkflowProcessList [get]
+func GetWorkflowProcessList(c *gin.Context) {
+	var pageInfo request.WorkflowProcessSearch
+	_ = c.ShouldBindQuery(&pageInfo)
+	err, list, total := service.GetWorkflowProcessInfoList(pageInfo)
+	if err != nil {
+		response.FailWithMessage(fmt.Sprintf("获取数据失败，%v", err), c)
+	} else {
+		response.OkWithData(resp.PageResult{
+			List:     list,
+			Total:    total,
+			Page:     pageInfo.Page,
+			PageSize: pageInfo.PageSize,
+		}, c)
+	}
+}

server/cmd/datas/apis.go

@@ -74,6 +74,12 @@ var Apis = []model.SysApi{
 	{gorm.Model{ID: 65, CreatedAt: time.Now(), UpdatedAt: time.Now()}, "/user/setUserInfo", "设置用户信息", "user", "PUT"},
 	{gorm.Model{ID: 66, CreatedAt: time.Now(), UpdatedAt: time.Now()}, "/system/getServerInfo", "获取服务器信息", "system", "POST"},
 	{gorm.Model{ID: 67, CreatedAt: time.Now(), UpdatedAt: time.Now()}, "/email/emailTest", "发送测试邮件", "email", "POST"},
+	{gorm.Model{ID: 68, CreatedAt: time.Now(), UpdatedAt: time.Now()}, "/workflowProcess/createWorkflowProcess", "新建工作流", "workflowProcess", "POST"},
+	{gorm.Model{ID: 69, CreatedAt: time.Now(), UpdatedAt: time.Now()}, "/workflowProcess/deleteWorkflowProcess", "删除工作流", "workflowProcess", "DELETE"},
+	{gorm.Model{ID: 70, CreatedAt: time.Now(), UpdatedAt: time.Now()}, "/workflowProcess/deleteWorkflowProcessByIds", "批量删除工作流", "workflowProcess", "DELETE"},
+	{gorm.Model{ID: 71, CreatedAt: time.Now(), UpdatedAt: time.Now()}, "/workflowProcess/updateWorkflowProcess", "更新工作流", "workflowProcess", "PUT"},
+	{gorm.Model{ID: 72, CreatedAt: time.Now(), UpdatedAt: time.Now()}, "/workflowProcess/findWorkflowProcess", "根据ID获取工作流", "workflowProcess", "GET"},
+	{gorm.Model{ID: 73, CreatedAt: time.Now(), UpdatedAt: time.Now()}, "/workflowProcess/getWorkflowProcessList", "获取工作流", "workflowProcess", "GET"},
 }
 
 func InitSysApi(db *gorm.DB) (err error) {

server/cmd/datas/authority_menus.go

@@ -39,6 +39,7 @@ var AuthorityMenus = []SysAuthorityMenus{
 	{"888", 27},
 	{"888", 28},
 	{"888", 29},
+	{"888", 30},
 	{"8881", 1},
 	{"8881", 2},
 	{"8881", 8},

server/cmd/datas/casbins.go

@@ -73,6 +73,12 @@ var Carbines = []gormadapter.CasbinRule{
 	{PType: "p", V0: "888", V1: "/simpleUploader/upload", V2: "POST"},
 	{PType: "p", V0: "888", V1: "/simpleUploader/checkFileMd5", V2: "GET"},
 	{PType: "p", V0: "888", V1: "/simpleUploader/mergeFileMd5", V2: "GET"},
+	{PType: "p", V0: "888", V1: "/workflowProcess/createWorkflowProcess", V2: "POST"},
+	{PType: "p", V0: "888", V1: "/workflowProcess/deleteWorkflowProcess", V2: "DELETE"},
+	{PType: "p", V0: "888", V1: "/workflowProcess/deleteWorkflowProcessByIds", V2: "DELETE"},
+	{PType: "p", V0: "888", V1: "/workflowProcess/updateWorkflowProcess", V2: "PUT"},
+	{PType: "p", V0: "888", V1: "/workflowProcess/findWorkflowProcess", V2: "GET"},
+	{PType: "p", V0: "888", V1: "/workflowProcess/getWorkflowProcessList", V2: "GET"},
 	{PType: "p", V0: "8881", V1: "/base/login", V2: "POST"},
 	{PType: "p", V0: "8881", V1: "/user/register", V2: "POST"},
 	{PType: "p", V0: "8881", V1: "/api/createApi", V2: "POST"},

server/cmd/datas/menus.go

@@ -37,6 +37,7 @@ var BaseMenus = []model.SysBaseMenu{
 	{Model: gorm.Model{ID: 27, CreatedAt: time.Now(), UpdatedAt: time.Now()}, MenuLevel: 0, ParentId: "0", Path: "state", Name: "state", Hidden: false, Component: "view/system/state.vue", Sort: 6, Meta: model.Meta{Title: "服务器状态", Icon: "cloudy"}},
 	{Model: gorm.Model{ID: 28, CreatedAt: time.Now(), UpdatedAt: time.Now()}, MenuLevel: 0, ParentId: "0", Path: "workflow", Name: "workflow", Hidden: false, Component: "view/workflow/index.vue", Sort: 5, Meta: model.Meta{Title: "工作流功能", Icon: "phone"}},
 	{Model: gorm.Model{ID: 29, CreatedAt: time.Now(), UpdatedAt: time.Now()}, MenuLevel: 0, ParentId: "28", Path: "workflowCreate", Name: "workflowCreate", Hidden: false, Component: "view/workflow/workflowCreate/workflowCreate.vue", Sort: 0, Meta: model.Meta{Title: "工作流绘制", Icon: "circle-plus"}},
+	{Model: gorm.Model{ID: 30, CreatedAt: time.Now(), UpdatedAt: time.Now()}, MenuLevel: 0, ParentId: "28", Path: "workflowProcess", Name: "workflowProcess", Hidden: false, Component: "view/workflow/workflowProcess/workflowProcess.vue", Sort: 0, Meta: model.Meta{Title: "工作流列表", Icon: "s-cooperation"}},
 }
 
 func InitSysBaseMenus(db *gorm.DB) (err error) {

server/initialize/router.go

@@ -41,6 +41,7 @@ func Routers() *gin.Engine {
 	router.InitSysDictionaryRouter(ApiGroup)         // 字典管理
 	router.InitSysOperationRecordRouter(ApiGroup)    // 操作记录
 	router.InitEmailRouter(ApiGroup)                 // 邮件相关路由
+	router.InitWorkflowProcessRouter(ApiGroup)       // 工作流创建相关接口
 
 	global.GVA_LOG.Info("router register success")
 	return Router

server/model/request/wk_process.go

@@ -0,0 +1,8 @@
+package request
+
+import "gin-vue-admin/model"
+
+type WorkflowProcessSearch struct {
+	model.WorkflowProcess
+	PageInfo
+}

server/model/wf_process.go

@@ -1,15 +1,15 @@
 package model
 
 type WorkflowProcess struct {
-	ID       string         `json:"id" gorm:"comment:流程标识;primaryKey"`
-	Name     string         `json:"name" gorm:"comment:流程名称"`
-	Category string         `json:"category" gorm:"comment:分类"`
-	Clazz    string         `json:"clazz" gorm:"comment:类型"`
-	Label    string         `json:"label" gorm:"comment:流程标题"`
-	HideIcon bool           `json:"hideIcon" gorm:"comment:是否隐藏图标"`
-	Description bool           `json:"description" gorm:"comment:详细介绍"`
-	Nodes    []WorkflowNode `json:"nodes"` // 流程节点数据
-	Edges    []WorkflowEdge `json:"edges"` // 流程链接数据
+	ID          string         `json:"id" gorm:"comment:流程标识;primaryKey"`
+	Name        string         `json:"name" gorm:"comment:流程名称"`
+	Category    string         `json:"category" gorm:"comment:分类"`
+	Clazz       string         `json:"clazz" gorm:"comment:类型"`
+	Label       string         `json:"label" gorm:"comment:流程标题"`
+	HideIcon    bool           `json:"hideIcon" gorm:"comment:是否隐藏图标"`
+	Description string         `json:"description" gorm:"comment:详细介绍"`
+	Nodes       []WorkflowNode `json:"nodes"` // 流程节点数据
+	Edges       []WorkflowEdge `json:"edges"` // 流程链接数据
 }
 
 type WorkflowNode struct {
@@ -19,7 +19,7 @@ type WorkflowNode struct {
 	Label             string  `json:"label" gorm:"comment:节点名称"`
 	Type              string  `json:"type" gorm:"comment:图标类型"`
 	Shape             string  `json:"shape" gorm:"comment:形状"`
-	Description bool           `json:"description" gorm:"comment:详细介绍"`
+	Description       bool    `json:"description" gorm:"comment:详细介绍"`
 	X                 float64 `json:"y" gorm:"comment:x位置"`
 	Y                 float64 `json:"x" gorm:"comment:y位置"`
 	WaitState         string  `json:"waitState" gorm:"comment:等待属性"`

server/router/wk_process.go

@@ -0,0 +1,19 @@
+package router
+
+import (
+	"gin-vue-admin/api/v1"
+	"gin-vue-admin/middleware"
+	"github.com/gin-gonic/gin"
+)
+
+func InitWorkflowProcessRouter(Router *gin.RouterGroup) {
+	WorkflowProcessRouter := Router.Group("workflowProcess").Use(middleware.JWTAuth()).Use(middleware.CasbinHandler()).Use(middleware.OperationRecord())
+	{
+		WorkflowProcessRouter.POST("createWorkflowProcess", v1.CreateWorkflowProcess)             // 新建WorkflowProcess
+		WorkflowProcessRouter.DELETE("deleteWorkflowProcess", v1.DeleteWorkflowProcess)           // 删除WorkflowProcess
+		WorkflowProcessRouter.DELETE("deleteWorkflowProcessByIds", v1.DeleteWorkflowProcessByIds) // 批量删除WorkflowProcess
+		WorkflowProcessRouter.PUT("updateWorkflowProcess", v1.UpdateWorkflowProcess)              // 更新WorkflowProcess
+		WorkflowProcessRouter.GET("findWorkflowProcess", v1.FindWorkflowProcess)                  // 根据ID获取WorkflowProcess
+		WorkflowProcessRouter.GET("getWorkflowProcessList", v1.GetWorkflowProcessList)            // 获取WorkflowProcess列表
+	}
+}

server/service/wk_process.go

@@ -0,0 +1,87 @@
+package service
+
+import (
+	"gin-vue-admin/global"
+	"gin-vue-admin/model"
+	"gin-vue-admin/model/request"
+)
+
+// @title    CreateWorkflowProcess
+// @description   create a WorkflowProcess
+// @param     workflowProcess               model.WorkflowProcess
+// @auth                     （2020/04/05  20:22）
+// @return    err             error
+
+func CreateWorkflowProcess(workflowProcess model.WorkflowProcess) (err error) {
+	err = global.GVA_DB.Create(&workflowProcess).Error
+	return err
+}
+
+// @title    DeleteWorkflowProcess
+// @description   delete a WorkflowProcess
+// @auth                     （2020/04/05  20:22）
+// @param     workflowProcess               model.WorkflowProcess
+// @return                    error
+
+func DeleteWorkflowProcess(workflowProcess model.WorkflowProcess) (err error) {
+	err = global.GVA_DB.Delete(workflowProcess).Error
+	return err
+}
+
+// @title    DeleteWorkflowProcessByIds
+// @description   delete WorkflowProcesss
+// @auth                     （2020/04/05  20:22）
+// @param     workflowProcess               model.WorkflowProcess
+// @return                    error
+
+func DeleteWorkflowProcessByIds(ids request.IdsReq) (err error) {
+	err = global.GVA_DB.Delete(&[]model.WorkflowProcess{}, "id in ?", ids.Ids).Error
+	return err
+}
+
+// @title    UpdateWorkflowProcess
+// @description   update a WorkflowProcess
+// @param     workflowProcess          *model.WorkflowProcess
+// @auth                     （2020/04/05  20:22）
+// @return                    error
+
+func UpdateWorkflowProcess(workflowProcess *model.WorkflowProcess) (err error) {
+	err = global.GVA_DB.Save(workflowProcess).Error
+	return err
+}
+
+// @title    GetWorkflowProcess
+// @description   get the info of a WorkflowProcess
+// @auth                     （2020/04/05  20:22）
+// @param     id              uint
+// @return                    error
+// @return    WorkflowProcess        WorkflowProcess
+
+func GetWorkflowProcess(id string) (err error, workflowProcess model.WorkflowProcess) {
+	err = global.GVA_DB.Where("id = ?", id).First(&workflowProcess).Error
+	return
+}
+
+// @title    GetWorkflowProcessInfoList
+// @description   get WorkflowProcess list by pagination, 分页获取WorkflowProcess
+// @auth                     （2020/04/05  20:22）
+// @param     info            PageInfo
+// @return                    error
+
+func GetWorkflowProcessInfoList(info request.WorkflowProcessSearch) (err error, list interface{}, total int64) {
+	limit := info.PageSize
+	offset := info.PageSize * (info.Page - 1)
+	// 创建db
+	db := global.GVA_DB.Model(&model.WorkflowProcess{})
+	var workflowProcesss []model.WorkflowProcess
+	// 如果有条件搜索 下方会自动创建搜索语句
+	if info.Name != "" {
+		db = db.Where("`name` LIKE ?", "%"+info.Name+"%")
+	}
+	if info.Label != "" {
+		db = db.Where("`label` LIKE ?", "%"+info.Label+"%")
+	}
+	err = db.Count(&total).Error
+	err = db.Limit(limit).Offset(offset).Find(&workflowProcesss).Error
+	return err, workflowProcesss, total
+}

web/src/api/workflowProcess.js

@@ -0,0 +1,100 @@
+import service from '@/utils/request'
+
+// @Tags WorkflowProcess
+// @Summary 创建WorkflowProcess
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body model.WorkflowProcess true "创建WorkflowProcess"
+// @Success 200 {string} string "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /workflowProcess/createWorkflowProcess [post]
+export const createWorkflowProcess = (data) => {
+    return service({
+        url: "/workflowProcess/createWorkflowProcess",
+        method: 'post',
+        data
+    })
+}
+
+
+// @Tags WorkflowProcess
+// @Summary 删除WorkflowProcess
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body model.WorkflowProcess true "删除WorkflowProcess"
+// @Success 200 {string} string "{"success":true,"data":{},"msg":"删除成功"}"
+// @Router /workflowProcess/deleteWorkflowProcess [delete]
+export const deleteWorkflowProcess = (data) => {
+    return service({
+        url: "/workflowProcess/deleteWorkflowProcess",
+        method: 'delete',
+        data
+    })
+}
+
+// @Tags WorkflowProcess
+// @Summary 删除WorkflowProcess
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body request.IdsReq true "批量删除WorkflowProcess"
+// @Success 200 {string} string "{"success":true,"data":{},"msg":"删除成功"}"
+// @Router /workflowProcess/deleteWorkflowProcess [delete]
+export const deleteWorkflowProcessByIds = (data) => {
+    return service({
+        url: "/workflowProcess/deleteWorkflowProcessByIds",
+        method: 'delete',
+        data
+    })
+}
+
+// @Tags WorkflowProcess
+// @Summary 更新WorkflowProcess
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body model.WorkflowProcess true "更新WorkflowProcess"
+// @Success 200 {string} string "{"success":true,"data":{},"msg":"更新成功"}"
+// @Router /workflowProcess/updateWorkflowProcess [put]
+export const updateWorkflowProcess = (data) => {
+    return service({
+        url: "/workflowProcess/updateWorkflowProcess",
+        method: 'put',
+        data
+    })
+}
+
+
+// @Tags WorkflowProcess
+// @Summary 用id查询WorkflowProcess
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body model.WorkflowProcess true "用id查询WorkflowProcess"
+// @Success 200 {string} string "{"success":true,"data":{},"msg":"查询成功"}"
+// @Router /workflowProcess/findWorkflowProcess [get]
+export const findWorkflowProcess = (params) => {
+    return service({
+        url: "/workflowProcess/findWorkflowProcess",
+        method: 'get',
+        params
+    })
+}
+
+
+// @Tags WorkflowProcess
+// @Summary 分页获取WorkflowProcess列表
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body request.PageInfo true "分页获取WorkflowProcess列表"
+// @Success 200 {string} string "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /workflowProcess/getWorkflowProcessList [get]
+export const getWorkflowProcessList = (params) => {
+    return service({
+        url: "/workflowProcess/getWorkflowProcessList",
+        method: 'get',
+        params
+    })
+}

web/src/components/gva-wfd/components/DetailPanel/ProcessDetail.vue

@@ -29,6 +29,14 @@
                           :value="model.name"
                           @input="(value) => {onChange('name', value)}" />
             </div>
+            <div class="panelRow">
+                <div>详情说明：</div>
+                <el-input style="width:90%; font-size:12px"
+                          :disabled="readOnly"
+                          type="textarea"
+                          :value="model.description"
+                          @input="(value) => {onChange('description', value)}" />
+            </div>
         </div>
     </div>
 </template>

web/src/components/gva-wfd/components/DetailPanel/UserTaskDetail.vue

@@ -57,6 +57,14 @@
                              :disabled="readOnly"
                              :value="!!model.isSequential">{{i18n['userTask.counterSign']}}</el-checkbox>
             </div>
+            <div class="panelRow">
+                <div>详情说明：</div>
+                <el-input style="width:90%; font-size:12px"
+                          :disabled="readOnly"
+                          type="textarea"
+                          :value="model.description"
+                          @input="(value) => {onChange('description', value)}" />
+            </div>
         </div>
     </div>
 </template>

web/src/view/workflow/workflowCreate/workflowCreate.vue

@@ -32,6 +32,9 @@
   </div>
 </template>
 <script>
+import {
+    findWorkflowProcess
+} from "@/api/workflowProcess";  //  此处请自行替换地址
 import gvaWfd from "@/components/gva-wfd";
 import { getUserList } from "@/api/user";
 import { getAuthorityList } from "@/api/authority";
@@ -261,6 +264,10 @@ export default {
         });
       });
     }
+    if(this.$route.params.ID){
+      const res = await findWorkflowProcess({ ID: this.$route.params.ID });
+      console.log(res.data)
+    }
   }
 };
 </script>

web/src/view/workflow/workflowProcess/workflowProcess.vue

@@ -0,0 +1,190 @@
+<template>
+  <div>
+    <div class="search-term">
+      <el-form :inline="true" :model="searchInfo" class="demo-form-inline">
+        <el-form-item label="流程名称">
+          <el-input placeholder="搜索条件" v-model="searchInfo.name"></el-input>
+        </el-form-item>        
+        <el-form-item label="流程标题">
+          <el-input placeholder="搜索条件" v-model="searchInfo.label"></el-input>
+        </el-form-item>        
+        <el-form-item>
+          <el-button @click="onSubmit" type="primary">查询</el-button>
+        </el-form-item>
+        <el-form-item>
+          <el-popover placement="top" v-model="deleteVisible" width="160">
+            <p>确定要删除吗？</p>
+              <div style="text-align: right; margin: 0">
+                <el-button @click="deleteVisible = false" size="mini" type="text">取消</el-button>
+                <el-button @click="onDelete" size="mini" type="primary">确定</el-button>
+              </div>
+            <el-button icon="el-icon-delete" size="mini" slot="reference" type="danger">批量删除</el-button>
+          </el-popover>
+        </el-form-item>
+      </el-form>
+    </div>
+    <el-table
+      :data="tableData"
+      @selection-change="handleSelectionChange"
+      border
+      ref="multipleTable"
+      stripe
+      style="width: 100%"
+      tooltip-effect="dark"
+    >
+    <el-table-column type="selection" width="55"></el-table-column>
+    <el-table-column label="日期" width="180">
+         <template slot-scope="scope">{{scope.row.CreatedAt|formatDate}}</template>
+    </el-table-column>
+    
+    <el-table-column label="流程名称" prop="name" width="120"></el-table-column> 
+    
+    <el-table-column label="分类" prop="category" width="120"></el-table-column> 
+    
+    <el-table-column label="类型" prop="clazz" width="120"></el-table-column> 
+    
+    <el-table-column label="流程标题" prop="label" width="120"></el-table-column> 
+    
+    <el-table-column label="是否隐藏图标" prop="hideIcon" width="120">
+         <template slot-scope="scope">{{scope.row.hideIcon|formatBoolean}}</template>
+    </el-table-column>
+    
+    <el-table-column label="详细介绍" prop="description" width="120"></el-table-column> 
+    
+      <el-table-column label="按钮组">
+        <template slot-scope="scope">
+          <el-button @click="updateWorkflowProcess(scope.row)" size="small" type="primary">变更</el-button>
+          <el-popover placement="top" width="160" v-model="scope.row.visible">
+            <p>确定要删除吗？</p>
+            <div style="text-align: right; margin: 0">
+              <el-button size="mini" type="text" @click="scope.row.visible = false">取消</el-button>
+              <el-button type="primary" size="mini" @click="deleteWorkflowProcess(scope.row)">确定</el-button>
+            </div>
+            <el-button type="danger" icon="el-icon-delete" size="mini" slot="reference">删除</el-button>
+          </el-popover>
+        </template>
+      </el-table-column>
+    </el-table>
+
+    <el-pagination
+      :current-page="page"
+      :page-size="pageSize"
+      :page-sizes="[10, 30, 50, 100]"
+      :style="{float:'right',padding:'20px'}"
+      :total="total"
+      @current-change="handleCurrentChange"
+      @size-change="handleSizeChange"
+      layout="total, sizes, prev, pager, next, jumper"
+    ></el-pagination>
+  </div>
+</template>
+
+<script>
+import {
+    deleteWorkflowProcess,
+    deleteWorkflowProcessByIds,
+    getWorkflowProcessList
+} from "@/api/workflowProcess";  //  此处请自行替换地址
+import { formatTimeToStr } from "@/utils/data";
+import infoList from "@/components/mixins/infoList";
+
+export default {
+  name: "WorkflowProcess",
+  mixins: [infoList],
+  data() {
+    return {
+      listApi: getWorkflowProcessList,
+      dialogFormVisible: false,
+      visible: false,
+      deleteVisible: false,
+      multipleSelection: [],formData: {
+        name:null,category:null,clazz:null,label:null,hideIcon:null,description:null,
+      }
+    };
+  },
+  filters: {
+    formatDate: function(time) {
+      if (time != null && time != "") {
+        var date = new Date(time);
+        return formatTimeToStr(date, "yyyy-MM-dd hh:mm:ss");
+      } else {
+        return "";
+      }
+    },
+    formatBoolean: function(bool) {
+      if (bool != null) {
+        return bool ? "是" :"否";
+      } else {
+        return "";
+      }
+    }
+  },
+  methods: {
+      //条件搜索前端看此方法
+      onSubmit() {
+        this.page = 1
+        this.pageSize = 10          
+        if (this.searchInfo.hideIcon==""){
+          this.searchInfo.hideIcon=null
+        }       
+        this.getTableData()
+      },
+      handleSelectionChange(val) {
+        this.multipleSelection = val
+      },
+      async onDelete() {
+        const ids = []
+        this.multipleSelection &&
+          this.multipleSelection.map(item => {
+            ids.push(item.ID)
+          })
+        const res = await deleteWorkflowProcessByIds({ ids })
+        if (res.code == 0) {
+          this.$message({
+            type: 'success',
+            message: '删除成功'
+          })
+          this.deleteVisible = false
+          this.getTableData()
+        }
+      },
+    async updateWorkflowProcess(row) {
+      this.$router.push({name:"workflowCreate",params:{
+        ID:row.ID,
+        type:'edit'
+      }})
+    },
+    closeDialog() {
+      this.dialogFormVisible = false;
+      this.formData = {
+        
+          name:null,
+          category:null,
+          clazz:null,
+          label:null,
+          hideIcon:null,
+          description:null,
+      };
+    },
+    async deleteWorkflowProcess(row) {
+      this.visible = false;
+      const res = await deleteWorkflowProcess({ ID: row.ID });
+      if (res.code == 0) {
+        this.$message({
+          type: "success",
+          message: "删除成功"
+        });
+        this.getTableData();
+      }
+    },
+    openDialog() {
+      this.dialogFormVisible = true;
+    }
+  },
+  async created() {
+    await this.getTableData();}
+};
+</script>
+
+<style>
+</style>