工作流起始接口以及动态获取view功能

server/api/v1/wk_process.go

@@ -104,6 +104,25 @@ func FindWorkflowProcess(c *gin.Context) {
 	}
 }
 
+// @Tags WorkflowProcess
+// @Summary 用id查询工作流步骤
+// @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/findWorkflowCreateStep [get]
+func FindWorkflowCreateStep(c *gin.Context) {
+	var workflowProcess model.WorkflowProcess
+	_ = c.ShouldBindQuery(&workflowProcess)
+	err, workflow := service.GetWorkflowCreateStep(workflowProcess.ID)
+	if err != nil {
+		response.FailWithMessage(fmt.Sprintf("查询失败，%v", err), c)
+	} else {
+		response.OkWithData(gin.H{"workflow": workflow}, c)
+	}
+}
+
 // @Tags WorkflowProcess
 // @Summary 分页获取WorkflowProcess列表
 // @Security ApiKeyAuth

server/cmd/datas/apis.go

@@ -82,7 +82,8 @@ var Apis = []model.SysApi{
 	{global.GVA_MODEL{ID: 71, CreatedAt: time.Now(), UpdatedAt: time.Now()}, "/workflowProcess/updateWorkflowProcess", "更新工作流", "workflowProcess", "PUT"},
 	{global.GVA_MODEL{ID: 72, CreatedAt: time.Now(), UpdatedAt: time.Now()}, "/workflowProcess/findWorkflowProcess", "根据ID获取工作流", "workflowProcess", "GET"},
 	{global.GVA_MODEL{ID: 73, CreatedAt: time.Now(), UpdatedAt: time.Now()}, "/workflowProcess/getWorkflowProcessList", "获取工作流", "workflowProcess", "GET"},
-	}
+	{global.GVA_MODEL{ID: 74, CreatedAt: time.Now(), UpdatedAt: time.Now()}, "/workflowProcess/findWorkflowCreateStep", "获取工作流步骤", "workflowProcess", "GET"},
+}
 
 func InitSysApi(db *gorm.DB) (err error) {
 	return db.Transaction(func(tx *gorm.DB) error {

server/cmd/datas/authority_menus.go

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

server/cmd/datas/casbins.go

@@ -80,6 +80,7 @@ var Carbines = []gormadapter.CasbinRule{
 	{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: "888", V1: "/workflowProcess/findWorkflowCreateStep", 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

@@ -40,6 +40,7 @@ var BaseMenus = []model.SysBaseMenu{
 	{GVA_MODEL: global.GVA_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"}},
 	{GVA_MODEL: global.GVA_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"}},
 	{GVA_MODEL: global.GVA_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"}},
+	{GVA_MODEL: global.GVA_MODEL{ID: 31, CreatedAt: time.Now(), UpdatedAt: time.Now()}, MenuLevel: 0, ParentId: "28", Path: "workflowUse", Name: "workflowUse", Hidden: true, Component: "view/workflow/workflowUse/workflowUse.vue", Sort: 0, Meta: model.Meta{Title: "使用工作流", Icon: "video-play"}},
 }
 
 func InitSysBaseMenus(db *gorm.DB) (err error) {

server/model/wf_process.go

@@ -6,6 +6,22 @@ import (
 	"time"
 )
 
+//定义clazz常量
+
+const (
+	USER_TASK     string = "userTask"
+	SCRIPT_TASK   string = "scriptTask"
+	RECEIVE_TASK  string = "receiveTask"
+	MAIL_TASK     string = "mailTask"
+	TIMER_START   string = "timerStart"
+	MESSAGE_START string = "messageStart"
+	GATEWAY       string = "gateway"
+	FLOW          string = "flow"
+	START         string = "start"
+	END           string = "end"
+	PROCESS       string = "process"
+)
+
 type WorkflowProcess struct {
 	ID          string `json:"id" form:"id" gorm:"comment:流程标识;primaryKey;unique;not null"`
 	CreatedAt   time.Time
@@ -47,6 +63,7 @@ type WorkflowNode struct {
 	DueDate           time.Time      `json:"dueDate" gorm:"comment:到期时间"`
 	AssignType        string         `json:"assignType" gorm:"comment:审批类型"`
 	AssignValue       string         `json:"assignValue" gorm:"comment:审批类型值"`
+	Success           bool           `json:"success" gorm:"comment:是否成功"`
 }
 
 type WorkflowEdge struct {

server/router/wk_process.go

@@ -14,6 +14,7 @@ func InitWorkflowProcessRouter(Router *gin.RouterGroup) {
 		WorkflowProcessRouter.DELETE("deleteWorkflowProcessByIds", v1.DeleteWorkflowProcessByIds) // 批量删除WorkflowProcess
 		WorkflowProcessRouter.PUT("updateWorkflowProcess", v1.UpdateWorkflowProcess)              // 更新WorkflowProcess
 		WorkflowProcessRouter.GET("findWorkflowProcess", v1.FindWorkflowProcess)                  // 根据ID获取WorkflowProcess
+		WorkflowProcessRouter.GET("findWorkflowCreateStep", v1.FindWorkflowCreateStep)            // 根据ID获取工作流开启步骤
 		WorkflowProcessRouter.GET("getWorkflowProcessList", v1.GetWorkflowProcessList)            // 获取WorkflowProcess列表
 	}
 }

server/service/wk_process.go

@@ -110,13 +110,24 @@ func UpdateWorkflowProcess(workflowProcess *model.WorkflowProcess) (err error) {
 //@function: GetWorkflowProcess
 //@description: 获取工作流相关信息
 //@param: id string
-//@return: err error
+//@return: err error,workflowProcess model.WorkflowProcess
 
 func GetWorkflowProcess(id string) (err error, workflowProcess model.WorkflowProcess) {
 	err = global.GVA_DB.Preload("Nodes").Preload("Edges").Where("id = ?", id).First(&workflowProcess).Error
 	return
 }
 
+//@author: [piexlmax](https://github.com/piexlmax)
+//@function: GetWorkflowCreateStep
+//@description: 获取工作流步骤信息
+//@param: id string
+//@return: err error, workflowNodes []model.WorkflowNode
+
+func GetWorkflowCreateStep(id string) (err error, workflowNode model.WorkflowProcess) {
+	err = global.GVA_DB.Preload("Nodes", "clazz = ?", model.START).Where("id = ?", id).First(&workflowNode).Error
+	return
+}
+
 //@author: [piexlmax](https://github.com/piexlmax)
 //@function: GetWorkflowProcessInfoList
 //@description: 获取工作流列表

web/src/api/workflowProcess.js

@@ -97,4 +97,20 @@ export const getWorkflowProcessList = (params) => {
         method: 'get',
         params
     })
+}
+
+// @Tags WorkflowProcess
+// @Summary 用id查询工作流步骤
+// @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/findWorkflowCreateStep [get]
+export const findWorkflowCreateStep = (params) => {
+    return service({
+        url: "/workflowProcess/findWorkflowCreateStep",
+        method: 'get',
+        params
+    })
 }

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

@@ -1,19 +1,29 @@
 <template>
-    <div>
-        <div class="panelRow">
-            <div>{{i18n['label']}}：</div>
-            <el-input style="width:90%; font-size:12px"
-                      :disabled="readOnly"
-                      :value="model.label"
-                       placeholder="请输入标题"
-                      @input="(value) => {onChange('label', value)}" />
-        </div>
-        <div class="panelRow">
-            <el-checkbox @change="(value) => onChange('hideIcon', value)"
-                         :disabled="readOnly"
-                         :value="!!model.hideIcon">{{i18n['hideIcon']}}</el-checkbox>
-        </div>
+  <div>
+    <div class="panelRow">
+      <div>{{ i18n['label'] }}：</div>
+      <el-input
+        style="width: 90%; font-size: 12px"
+        :disabled="readOnly"
+        :value="model.label"
+        placeholder="请输入标题"
+        @input="
+          (value) => {
+            onChange('label', value)
+          }
+        "
+      />
     </div>
+
+    <div class="panelRow">
+      <el-checkbox
+        @change="(value) => onChange('hideIcon', value)"
+        :disabled="readOnly"
+        :value="!!model.hideIcon"
+        >{{ i18n['hideIcon'] }}</el-checkbox
+      >
+    </div>
+  </div>
 </template>
 <script>
   export default {

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

@@ -1,10 +1,32 @@
 <template>
-    <div :data-clazz="model.clazz">
-        <div class="panelTitle">{{i18n['endEvent']}}</div>
-        <div class="panelBody">
-            <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
-        </div>
+  <div :data-clazz="model.clazz">
+    <div class="panelTitle">{{ i18n['endEvent'] }}</div>
+    <div class="panelBody">
+      <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+      <div class="panelRow">
+        <el-checkbox
+          @change="(value) => onChange('success', value)"
+          :disabled="readOnly"
+          :value="!!model.success"
+          >是否成功</el-checkbox
+        >
+      </div>
+      <div class="panelRow">
+        <div>步骤：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.step"
+          placeholder="请输入步骤"
+          @input="
+            (value) => {
+              onChange('step', value)
+            }
+          "
+        />
+      </div>
     </div>
+  </div>
 </template>
 <script>
   import DefaultDetail from "./DefaultDetail";

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

@@ -1,31 +1,46 @@
 <template>
-    <div :data-clazz="model.clazz">
-        <div class="panelTitle">{{i18n['sequenceFlow']}}</div>
-        <div class="panelBody">
-            <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
-            <div class="panelRow">
-                <div>{{i18n['sequenceFlow.expression']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          type="textarea"
-                          :rows="4"
-                          :disabled="readOnly"
-                          :value="model.conditionExpression"
-                          @input="(value) => {onChange('conditionExpression', value)}" />
-            </div>
-            <div class="panelRow">
-                <div>{{i18n['sequenceFlow.seq']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          :disabled="readOnly"
-                          :value="model.seq"
-                          @input="(value) => {onChange('seq', value)}" />
-            </div>
-            <div class="panelRow">
-                <el-checkbox @change="(value) => onChange('reverse', value)"
-                             :disabled="readOnly"
-                             :value="!!model.reverse">{{i18n['sequenceFlow.reverse']}}</el-checkbox>
-            </div>
-        </div>
+  <div :data-clazz="model.clazz">
+    <div class="panelTitle">{{ i18n['sequenceFlow'] }}</div>
+    <div class="panelBody">
+      <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+      <div class="panelRow">
+        <div>{{ i18n['sequenceFlow.expression'] }}：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          type="textarea"
+          :rows="4"
+          :disabled="readOnly"
+          :value="model.conditionExpression"
+          @input="
+            (value) => {
+              onChange('conditionExpression', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>{{ i18n['sequenceFlow.seq'] }}：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.seq"
+          @input="
+            (value) => {
+              onChange('seq', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <el-checkbox
+          @change="(value) => onChange('reverse', value)"
+          :disabled="readOnly"
+          :value="!!model.reverse"
+          >{{ i18n['sequenceFlow.reverse'] }}</el-checkbox
+        >
+      </div>
     </div>
+  </div>
 </template>
 <script>
   import DefaultDetail from "./DefaultDetail";

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

@@ -1,11 +1,18 @@
 <template>
-    <div :data-clazz="model.clazz">
-        <div class="panelTitle">{{model.clazz === 'exclusiveGateway' || model.clazz === 'gateway' ? i18n['exclusiveGateway']
-            : model.clazz === 'parallelGateway' ? i18n['parallelGateway'] : i18n['inclusiveGateway']}}</div>
-        <div class="panelBody">
-            <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
-        </div>
+  <div :data-clazz="model.clazz">
+    <div class="panelTitle">
+      {{
+        model.clazz === 'exclusiveGateway' || model.clazz === 'gateway'
+          ? i18n['exclusiveGateway']
+          : model.clazz === 'parallelGateway'
+          ? i18n['parallelGateway']
+          : i18n['inclusiveGateway']
+      }}
     </div>
+    <div class="panelBody">
+      <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+    </div>
+  </div>
 </template>
 <script>
   import DefaultDetail from "./DefaultDetail";

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

@@ -1,17 +1,37 @@
 <template>
-    <div :data-clazz="model.clazz">
-        <div class="panelTitle">{{i18n['javaTask']}}</div>
-        <div class="panelBody">
-            <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
-            <div class="panelRow">
-                <div>{{i18n['javaTask.javaClass']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          :disabled="readOnly"
-                          :value="model.javaClass"
-                          @input="(value) => {onChange('javaClass', value)}" />
-            </div>
-        </div>
+  <div :data-clazz="model.clazz">
+    <div class="panelTitle">{{ i18n['javaTask'] }}</div>
+    <div class="panelBody">
+      <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+      <div class="panelRow">
+        <div>{{ i18n['javaTask.javaClass'] }}：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.javaClass"
+          @input="
+            (value) => {
+              onChange('javaClass', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>步骤：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.step"
+          placeholder="请输入步骤"
+          @input="
+            (value) => {
+              onChange('step', value)
+            }
+          "
+        />
+      </div>
     </div>
+  </div>
 </template>
 <script>
   import DefaultDetail from "./DefaultDetail";

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

@@ -1,33 +1,65 @@
 <template>
-    <div :data-clazz="model.clazz">
-        <div class="panelTitle">{{i18n['mailTask']}}</div>
-        <div class="panelBody">
-            <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
-            <div class="panelRow">
-                <div>{{i18n['mailTask.to']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          :disabled="readOnly"
-                          :value="model.to"
-                          @input="(value) => {onChange('to', value)}" />
-            </div>
-            <div class="panelRow">
-                <div>{{i18n['mailTask.subject']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          :disabled="readOnly"
-                          :value="model.subject"
-                          @input="(value) => {onChange('subject', value)}" />
-            </div>
-            <div class="panelRow">
-                <div>{{i18n['mailTask.content']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          type="textarea"
-                          :rows="4"
-                          :disabled="readOnly"
-                          :value="model.content"
-                          @input="(value) => {onChange('content', value)}" />
-            </div>
-        </div>
+  <div :data-clazz="model.clazz">
+    <div class="panelTitle">{{ i18n['mailTask'] }}</div>
+    <div class="panelBody">
+      <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+      <div class="panelRow">
+        <div>{{ i18n['mailTask.to'] }}：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.to"
+          @input="
+            (value) => {
+              onChange('to', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>{{ i18n['mailTask.subject'] }}：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.subject"
+          @input="
+            (value) => {
+              onChange('subject', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>{{ i18n['mailTask.content'] }}：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          type="textarea"
+          :rows="4"
+          :disabled="readOnly"
+          :value="model.content"
+          @input="
+            (value) => {
+              onChange('content', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>步骤：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.step"
+          placeholder="请输入步骤"
+          @input="
+            (value) => {
+              onChange('step', value)
+            }
+          "
+        />
+      </div>
     </div>
+  </div>
 </template>
 <script>
   import DefaultDetail from "./DefaultDetail";

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

@@ -1,20 +1,45 @@
 <template>
-    <div :data-clazz="model.clazz">
-        <div class="panelTitle">{{i18n['messageEvent']}}</div>
-        <div class="panelBody">
-            <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
-            <div class="panelRow">
-                <div>{{i18n['messageEvent.message']}}：</div>
-                <el-select style="width:90%; font-size: 12px"
-                           :placeholder="i18n['messageEvent.message']"
-                           :value="model.message"
-                           :disabled="readOnly"
-                           @change="(e) => { onChange('message', e) }">
-                    <el-option v-for="message in messageDefs" :key="message.id" :label="message.name" :value="message.id" />
-                </el-select>
-            </div>
-        </div>
+  <div :data-clazz="model.clazz">
+    <div class="panelTitle">{{ i18n['messageEvent'] }}</div>
+    <div class="panelBody">
+      <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+      <div class="panelRow">
+        <div>{{ i18n['messageEvent.message'] }}：</div>
+        <el-select
+          style="width: 90%; font-size: 12px"
+          :placeholder="i18n['messageEvent.message']"
+          :value="model.message"
+          :disabled="readOnly"
+          @change="
+            (e) => {
+              onChange('message', e)
+            }
+          "
+        >
+          <el-option
+            v-for="message in messageDefs"
+            :key="message.id"
+            :label="message.name"
+            :value="message.id"
+          />
+        </el-select>
+      </div>
+      <div class="panelRow">
+        <div>步骤：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.step"
+          placeholder="请输入步骤"
+          @input="
+            (value) => {
+              onChange('step', value)
+            }
+          "
+        />
+      </div>
     </div>
+  </div>
 </template>
 <script>
   import DefaultDetail from "./DefaultDetail";

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

@@ -1,48 +1,88 @@
 <template>
-    <div :data-clazz="model.clazz">
-        <div class="panelTitle">{{i18n['process']}}</div>
-        <div class="panelBody">
-            <div class="panelRow">
-                <div>{{i18n['process.id']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          :disabled="readOnly || !!(this.$route.query.type)"
-                          placeholder="必填（唯一标识）"
-                          :value="model.id"
-                          @input="(value) => {onChange('id', value)}" />
-            </div>
-            <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
-            <div class="panelRow">
-                <div>{{i18n['process.category']}}：</div>
-                <el-select style="width:90%; font-size:12px"
-                           :disabled="readOnly"
-                           :value="model.category"
-                           allow-create
-                           :filterable="true"
-                           :filter-method="filterCategory"
-                           @change="(e) => onChange('category', e)">
-                    <el-option v-for="category in categoryCopy" :key="category.id" :label="category.name" :value="category.id" />
-                </el-select>
-            </div>
-          
-            <div class="panelRow">
-                <div>{{i18n['process.name']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          :disabled="readOnly"
-                           placeholder="请输入流程名称"
-                          :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"
-                           placeholder="请输入详情说明"
-                          :value="model.description"
-                          @input="(value) => {onChange('description', value)}" />
-            </div>
-        </div>
+  <div :data-clazz="model.clazz">
+    <div class="panelTitle">{{ i18n['process'] }}</div>
+    <div class="panelBody">
+      <div class="panelRow">
+        <div>{{ i18n['process.id'] }}：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly || !!this.$route.query.type"
+          placeholder="必填（唯一标识）"
+          :value="model.id"
+          @input="
+            (value) => {
+              onChange('id', value)
+            }
+          "
+        />
+      </div>
+      <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+      <div class="panelRow">
+        <div>{{ i18n['process.category'] }}：</div>
+        <el-select
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.category"
+          allow-create
+          :filterable="true"
+          :filter-method="filterCategory"
+          @change="(e) => onChange('category', e)"
+        >
+          <el-option
+            v-for="category in categoryCopy"
+            :key="category.id"
+            :label="category.name"
+            :value="category.id"
+          />
+        </el-select>
+      </div>
+
+      <div class="panelRow">
+        <div>{{ i18n['process.name'] }}：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          placeholder="请输入流程名称"
+          :value="model.name"
+          @input="
+            (value) => {
+              onChange('name', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>默认视图文件路径（以view开头）</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          placeholder="请输入视图文件路径（以view开头）"
+          type="view"
+          :value="model.view"
+          @input="
+            (value) => {
+              onChange('view', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>详情说明：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          type="textarea"
+          placeholder="请输入详情说明"
+          :value="model.description"
+          @input="
+            (value) => {
+              onChange('description', value)
+            }
+          "
+        />
+      </div>
     </div>
+  </div>
 </template>
 <script>
   import DefaultDetail from "./DefaultDetail";

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

@@ -1,24 +1,50 @@
 <template>
-    <div :data-clazz="model.clazz">
-        <div class="panelTitle">{{i18n['receiveTask']}}</div>
-        <div class="panelBody">
-            <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
-            <div class="panelRow">
-                <div>{{i18n['receiveTask.waitState']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          :disabled="readOnly"
-                          :value="model.waitState"
-                          @input="(value) => {onChange('waitState', value)}" />
-            </div>
-            <div class="panelRow">
-                <div>{{i18n['receiveTask.stateValue']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          :disabled="readOnly"
-                          :value="model.stateValue"
-                          @input="(value) => {onChange('stateValue', value)}" />
-            </div>
-        </div>
+  <div :data-clazz="model.clazz">
+    <div class="panelTitle">{{ i18n['receiveTask'] }}</div>
+    <div class="panelBody">
+      <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+      <div class="panelRow">
+        <div>{{ i18n['receiveTask.waitState'] }}：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.waitState"
+          @input="
+            (value) => {
+              onChange('waitState', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>{{ i18n['receiveTask.stateValue'] }}：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.stateValue"
+          @input="
+            (value) => {
+              onChange('stateValue', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>步骤：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.step"
+          placeholder="请输入步骤"
+          @input="
+            (value) => {
+              onChange('step', value)
+            }
+          "
+        />
+      </div>
     </div>
+  </div>
 </template>
 <script>
   import DefaultDetail from "./DefaultDetail";

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

@@ -1,19 +1,39 @@
 <template>
-    <div :data-clazz="model.clazz">
-        <div class="panelTitle">{{i18n['scriptTask']}}</div>
-        <div class="panelBody">
-            <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
-            <div class="panelRow">
-                <div>{{i18n['scriptTask.script']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          type="textarea"
-                          :rows="4"
-                          :disabled="readOnly"
-                          :value="model.script"
-                          @input="(value) => {onChange('script', value)}" />
-            </div>
-        </div>
+  <div :data-clazz="model.clazz">
+    <div class="panelTitle">{{ i18n['scriptTask'] }}</div>
+    <div class="panelBody">
+      <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+      <div class="panelRow">
+        <div>{{ i18n['scriptTask.script'] }}：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          type="textarea"
+          :rows="4"
+          :disabled="readOnly"
+          :value="model.script"
+          @input="
+            (value) => {
+              onChange('script', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>步骤：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.step"
+          placeholder="请输入步骤"
+          @input="
+            (value) => {
+              onChange('step', value)
+            }
+          "
+        />
+      </div>
     </div>
+  </div>
 </template>
 <script>
   import DefaultDetail from "./DefaultDetail";

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

@@ -1,20 +1,45 @@
 <template>
-    <div :data-clazz="model.clazz">
-        <div class="panelTitle">{{i18n['signalEvent']}}</div>
-        <div class="panelBody">
-            <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
-            <div class="panelRow">
-                <div>{{i18n['signalEvent.signal']}}：</div>
-                <el-select style="width:90%; font-size: 12px"
-                           :placeholder="i18n['signalEvent.signal']"
-                           :value="model.signal"
-                           :disabled="readOnly"
-                           @change="(e) => { onChange('signal', e) }">
-                    <el-option v-for="signal in signalDefs" :key="signal.id" :label="signal.name" :value="signal.id" />
-                </el-select>
-            </div>
-        </div>
+  <div :data-clazz="model.clazz">
+    <div class="panelTitle">{{ i18n['signalEvent'] }}</div>
+    <div class="panelBody">
+      <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+      <div class="panelRow">
+        <div>{{ i18n['signalEvent.signal'] }}：</div>
+        <el-select
+          style="width: 90%; font-size: 12px"
+          :placeholder="i18n['signalEvent.signal']"
+          :value="model.signal"
+          :disabled="readOnly"
+          @change="
+            (e) => {
+              onChange('signal', e)
+            }
+          "
+        >
+          <el-option
+            v-for="signal in signalDefs"
+            :key="signal.id"
+            :label="signal.name"
+            :value="signal.id"
+          />
+        </el-select>
+      </div>
+      <div class="panelRow">
+        <div>步骤：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.step"
+          placeholder="请输入步骤"
+          @input="
+            (value) => {
+              onChange('step', value)
+            }
+          "
+        />
+      </div>
     </div>
+  </div>
 </template>
 <script>
   import DefaultDetail from "./DefaultDetail";

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

@@ -1,18 +1,39 @@
 <template>
-    <div :data-clazz="model.clazz">
-        <div class="panelTitle">{{i18n['startEvent']}}</div>
-        <div class="panelBody">
-            <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
-        </div>
-         <div class="panelRow">
-                <div>视图路径（以view开头）</div>
-                <el-input style="width:90%; font-size:12px"
-                          :disabled="readOnly"
-                          type="view"
-                          :value="model.view"
-                          @input="(value) => {onChange('view', value)}" />
-            </div>
+  <div :data-clazz="model.clazz">
+    <div class="panelTitle">{{ i18n['startEvent'] }}</div>
+    <div class="panelBody">
+      <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+      <div class="panelRow">
+        <div>视图文件路径</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          placeholder="请输入视图文件路径（以view开头）"
+          type="view"
+          :value="model.view"
+          @input="
+            (value) => {
+              onChange('view', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>步骤：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.step"
+          placeholder="请输入步骤"
+          @input="
+            (value) => {
+              onChange('step', value)
+            }
+          "
+        />
+      </div>
     </div>
+  </div>
 </template>
 <script>
   import DefaultDetail from "./DefaultDetail";

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

@@ -1,36 +1,70 @@
 <template>
-    <div :data-clazz="model.clazz">
-        <div class="panelTitle">{{i18n['timerEvent']}}</div>
-        <div class="panelBody">
-            <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+  <div :data-clazz="model.clazz">
+    <div class="panelTitle">{{ i18n['timerEvent'] }}</div>
+    <div class="panelBody">
+      <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+      <div class="panelRow">
+        <div>{{ i18n['timerEvent.cycle'] }}：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          type="textarea"
+          :rows="4"
+          :disabled="readOnly"
+          :value="model.cycle"
+          @input="
+            (value) => {
+              onChange('cycle', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>{{ i18n['timerEvent.duration'] }}：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          type="textarea"
+          :rows="4"
+          :disabled="readOnly"
+          :value="model.duration"
+          @input="
+            (value) => {
+              onChange('duration', value)
+            }
+          "
+        />
+      </div>
+
+      <div class="panelRow">
+        <div>视图文件路径（以view开头）</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          placeholder="请输入视图文件路径（以view开头）"
+          type="view"
+          :value="model.view"
+          @input="
+            (value) => {
+              onChange('view', value)
+            }
+          "
+        />
+      </div>
             <div class="panelRow">
-                <div>{{i18n['timerEvent.cycle']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          type="textarea"
-                          :rows="4"
-                          :disabled="readOnly"
-                          :value="model.cycle"
-                          @input="(value) => {onChange('cycle', value)}" />
-            </div>
-            <div class="panelRow">
-                <div>{{i18n['timerEvent.duration']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          type="textarea"
-                          :rows="4"
-                          :disabled="readOnly"
-                          :value="model.duration"
-                          @input="(value) => {onChange('duration', value)}" />
-            </div>
-             <div class="panelRow">
-                <div>视图路径（以view开头）</div>
-                <el-input style="width:90%; font-size:12px"
-                          :disabled="readOnly"
-                          type="view"
-                          :value="model.view"
-                          @input="(value) => {onChange('view', value)}" />
-            </div>
-        </div>
+        <div>步骤：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.step"
+          placeholder="请输入步骤"
+          @input="
+            (value) => {
+              onChange('step', value)
+            }
+          "
+        />
+      </div>
     </div>
+  </div>
 </template>
 <script>
   import DefaultDetail from "./DefaultDetail";

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

@@ -1,79 +1,134 @@
 <template>
-    <div :data-clazz="model.clazz">
-        <div class="panelTitle">{{i18n['userTask']}}</div>
-        <div class="panelBody">
-            <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
-            <div class="panelRow">
-                <div>选择角色：</div>
-                <el-select style="width:90%; font-size: 12px"
-                           placeholder="请选择角色（与用户互斥）"
-                           :value="model.assignType"
-                           :disabled="readOnly"
-                           @change="(e) => { onChange('assignValue','');onChange('assignType', e) }">
-                    <el-option key="user" value="user" :label="'用户'"/>
-                    <el-option key="authority" value="authority" :label="'角色'"/>
-                </el-select>
-            </div>
-            <div v-if="model.assignType=='user'" class="panelRow">
-                <div>选择用户：</div>
-                <el-select style="width:90%; font-size:12px"
-                           :placeholder="'请选择用户'"
-                           :disabled="readOnly"
-                           :value="model.assignValue"
-                           clearable
-                           multiple
-                           :filterable="true"
-                           :filter-method="filterUsers"
-                           @change="(e) => onChange('assignValue', e)">
-                    <el-option v-for="user in usersCopy" :key="user.id" :label="user.name" :value="user.id" />
-                </el-select>
-            </div>
-            <div v-if="model.assignType=='authority'"  class="panelRow">
-                <div>选择角色：</div>
-                <el-select style="width:90%; font-size:12px"
-                           :placeholder="'请选择角色'"
-                           :disabled="readOnly"
-                           multiple
-                           :value="model.assignValue"
-                           clearable
-                           :filterable="true"
-                           :filter-method="filterAuthorities"
-                           @change="(e) => onChange('assignValue', e)">
-                    <el-option v-for="authority in authoritiesCopy" :key="authority.id" :label="authority.name" :value="authority.id" />
-                </el-select>
-            </div>
-            <div class="panelRow">
-                <div style="display:inline">{{i18n['userTask.dueDate']}}：</div>
-                <el-date-picker type="datetime"
-                                style="width:90%; min-width:null"
-                                :placeholder="i18n['userTask.dueDate.placeholder']"
-                                :disabled="readOnly"
-                                :value="model.dueDate"
-                                @input="(value) => onChange('dueDate', value)" />
-            </div>
-            <div class="panelRow">
-                <el-checkbox @change="(value) => onChange('isSequential', value)"
-                             :disabled="readOnly"
-                             :value="!!model.isSequential">{{i18n['userTask.counterSign']}}</el-checkbox>
-            </div>
-            <div class="panelRow">
-                <div>视图路径（以view开头）</div>
-                <el-input style="width:90%; font-size:12px"
-                          :disabled="readOnly"
-                          type="view"
-                          :value="model.view"
-                          @input="(value) => {onChange('view', 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 :data-clazz="model.clazz">
+    <div class="panelTitle">{{ i18n['userTask'] }}</div>
+    <div class="panelBody">
+      <DefaultDetail :model="model" :onChange="onChange" :readOnly="readOnly" />
+      <div class="panelRow">
+        <div>选择角色：</div>
+        <el-select
+          style="width: 90%; font-size: 12px"
+          placeholder="请选择角色（与用户互斥）"
+          :value="model.assignType"
+          :disabled="readOnly"
+          @change="
+            (e) => {
+              onChange('assignValue', '')
+              onChange('assignType', e)
+            }
+          "
+        >
+          <el-option key="user" value="user" :label="'用户'" />
+          <el-option key="authority" value="authority" :label="'角色'" />
+        </el-select>
+      </div>
+      <div v-if="model.assignType == 'user'" class="panelRow">
+        <div>选择用户：</div>
+        <el-select
+          style="width: 90%; font-size: 12px"
+          :placeholder="'请选择用户'"
+          :disabled="readOnly"
+          :value="model.assignValue"
+          clearable
+          multiple
+          :filterable="true"
+          :filter-method="filterUsers"
+          @change="(e) => onChange('assignValue', e)"
+        >
+          <el-option
+            v-for="user in usersCopy"
+            :key="user.id"
+            :label="user.name"
+            :value="user.id"
+          />
+        </el-select>
+      </div>
+      <div v-if="model.assignType == 'authority'" class="panelRow">
+        <div>选择角色：</div>
+        <el-select
+          style="width: 90%; font-size: 12px"
+          :placeholder="'请选择角色'"
+          :disabled="readOnly"
+          multiple
+          :value="model.assignValue"
+          clearable
+          :filterable="true"
+          :filter-method="filterAuthorities"
+          @change="(e) => onChange('assignValue', e)"
+        >
+          <el-option
+            v-for="authority in authoritiesCopy"
+            :key="authority.id"
+            :label="authority.name"
+            :value="authority.id"
+          />
+        </el-select>
+      </div>
+      <div class="panelRow">
+        <div style="display: inline">{{ i18n['userTask.dueDate'] }}：</div>
+        <el-date-picker
+          type="datetime"
+          style="width: 90%; min-width: null"
+          :placeholder="i18n['userTask.dueDate.placeholder']"
+          :disabled="readOnly"
+          :value="model.dueDate"
+          @input="(value) => onChange('dueDate', value)"
+        />
+      </div>
+      <div class="panelRow">
+        <el-checkbox
+          @change="(value) => onChange('isSequential', value)"
+          :disabled="readOnly"
+          :value="!!model.isSequential"
+          >{{ i18n['userTask.counterSign'] }}</el-checkbox
+        >
+      </div>
+      
+      <div class="panelRow">
+        <div>视图文件路径（以view开头）</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          placeholder="请输入视图文件路径（以view开头）"
+          type="view"
+          :value="model.view"
+          @input="
+            (value) => {
+              onChange('view', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>步骤：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          :value="model.step"
+          placeholder="请输入步骤"
+          @input="
+            (value) => {
+              onChange('step', value)
+            }
+          "
+        />
+      </div>
+      <div class="panelRow">
+        <div>详情说明：</div>
+        <el-input
+          style="width: 90%; font-size: 12px"
+          :disabled="readOnly"
+          placeholder="请输入详情内容"
+          type="textarea"
+          :value="model.description"
+          @input="
+            (value) => {
+              onChange('description', value)
+            }
+          "
+        />
+      </div>
     </div>
+  </div>
 </template>
 <script>
   import DefaultDetail from "./DefaultDetail";

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

@@ -1,19 +1,86 @@
 <template>
-    <div class="detailPanel" :style="{'height':height+'px'}">
-        <UserTaskDetail v-if="model.clazz === 'userTask'" :model="model" :onChange="onChange" :readOnly="readOnly" :users="users" :authorities="authorities" :groups="groups" />
-        <ScriptTaskDetail v-else-if="model.clazz === 'scriptTask'" :model="model" :onChange="onChange" :readOnly="readOnly" />
-        <!-- <JavaTaskDetail v-else-if="model.clazz === 'javaTask'" :model="model" :onChange="onChange" :readOnly="readOnly" /> -->
-        <ReceiveTaskDetail v-else-if="model.clazz === 'receiveTask'" :model="model" :onChange="onChange" :readOnly="readOnly" />
-        <MailTaskDetail v-else-if="model.clazz === 'mailTask'" :model="model" :onChange="onChange" :readOnly="readOnly" />
-        <TimerEventDetail v-else-if="model.clazz === 'timerStart' || model.clazz === 'timerCatch'" :model="model" :onChange="onChange" :readOnly="readOnly" />
-        <!-- <SignalEventDetail v-else-if="model.clazz === 'signalStart' || model.clazz === 'signalCatch'" :model="model" :onChange="onChange" :readOnly="readOnly" :signalDefs="signalDefs" /> -->
-        <MessageEventDetail v-else-if="model.clazz === 'messageStart' || model.clazz === 'messageCatch'" :model="model" :onChange="onChange" :readOnly="readOnly" :messageDefs="messageDefs" />
-        <GatewayDetail v-else-if="model.clazz === 'gateway' || model.clazz === 'exclusiveGateway' || model.clazz === 'parallelGateway' || model.clazz === 'inclusiveGateway'" :model="model" :onChange="onChange" :readOnly="readOnly" />
-        <FlowDetail v-else-if="model.clazz === 'flow'" :model="model" :onChange="onChange" :readOnly="readOnly" />
-        <StartEventDetail v-else-if="model.clazz === 'start'" :model="model" :onChange="onChange" :readOnly="readOnly" />
-        <EndEventDetail v-else-if="model.clazz === 'end'" :model="model" :onChange="onChange" :readOnly="readOnly" />
-        <ProcessDetail v-else-if="model.clazz === 'process'" :model="model" :onChange="onChange" :readOnly="readOnly" :categorys="categorys" />
-    </div>
+  <div class="detailPanel" :style="{ height: height + 'px' }">
+    <UserTaskDetail
+      v-if="model.clazz === 'userTask'"
+      :model="model"
+      :onChange="onChange"
+      :readOnly="readOnly"
+      :users="users"
+      :authorities="authorities"
+      :groups="groups"
+    />
+    <ScriptTaskDetail
+      v-else-if="model.clazz === 'scriptTask'"
+      :model="model"
+      :onChange="onChange"
+      :readOnly="readOnly"
+    />
+    <!-- <JavaTaskDetail v-else-if="model.clazz === 'javaTask'" :model="model" :onChange="onChange" :readOnly="readOnly" /> -->
+    <ReceiveTaskDetail
+      v-else-if="model.clazz === 'receiveTask'"
+      :model="model"
+      :onChange="onChange"
+      :readOnly="readOnly"
+    />
+    <MailTaskDetail
+      v-else-if="model.clazz === 'mailTask'"
+      :model="model"
+      :onChange="onChange"
+      :readOnly="readOnly"
+    />
+    <TimerEventDetail
+      v-else-if="model.clazz === 'timerStart' || model.clazz === 'timerCatch'"
+      :model="model"
+      :onChange="onChange"
+      :readOnly="readOnly"
+    />
+    <!-- <SignalEventDetail v-else-if="model.clazz === 'signalStart' || model.clazz === 'signalCatch'" :model="model" :onChange="onChange" :readOnly="readOnly" :signalDefs="signalDefs" /> -->
+    <MessageEventDetail
+      v-else-if="
+        model.clazz === 'messageStart' || model.clazz === 'messageCatch'
+      "
+      :model="model"
+      :onChange="onChange"
+      :readOnly="readOnly"
+      :messageDefs="messageDefs"
+    />
+    <GatewayDetail
+      v-else-if="
+        model.clazz === 'gateway' ||
+        model.clazz === 'exclusiveGateway' ||
+        model.clazz === 'parallelGateway' ||
+        model.clazz === 'inclusiveGateway'
+      "
+      :model="model"
+      :onChange="onChange"
+      :readOnly="readOnly"
+    />
+    <FlowDetail
+      v-else-if="model.clazz === 'flow'"
+      :model="model"
+      :onChange="onChange"
+      :readOnly="readOnly"
+    />
+    <StartEventDetail
+      v-else-if="model.clazz === 'start'"
+      :model="model"
+      :onChange="onChange"
+      :readOnly="readOnly"
+    />
+    <EndEventDetail
+      v-else-if="model.clazz === 'end'"
+      :model="model"
+      :onChange="onChange"
+      :readOnly="readOnly"
+    />
+    <ProcessDetail
+      v-else-if="model.clazz === 'process'"
+      :model="model"
+      :onChange="onChange"
+      :readOnly="readOnly"
+      :categorys="categorys"
+    />
+  </div>
 </template>
 <script>
   import UserTaskDetail from "./UserTaskDetail"
@@ -91,32 +158,32 @@
   }
 </script>
 <style lang="scss">
-    .detailPanel {
-        height: 100%;
-        background: #f0f2f5;
-        flex: 0 0 auto;
-        float: left;
-        width: 20%;
-        border-right: 1px solid #E9E9E9;
-        border-bottom: 1px solid #E9E9E9;
-        .panelTitle {
-            text-align: left;
-            height: 32px;
-            padding-left: 12px;
-            color: #000;
-            line-height: 28px;
-            background: #EBEEF2;
-            border-bottom: 1px solid #DCE3E8;
-        }
+.detailPanel {
+  height: 100%;
+  background: #f0f2f5;
+  flex: 0 0 auto;
+  float: left;
+  width: 20%;
+  border-right: 1px solid #e9e9e9;
+  border-bottom: 1px solid #e9e9e9;
+  .panelTitle {
+    text-align: left;
+    height: 32px;
+    padding-left: 12px;
+    color: #000;
+    line-height: 28px;
+    background: #ebeef2;
+    border-bottom: 1px solid #dce3e8;
+  }
 
-        .panelBody {
-            .panelRow {
-                text-align: left;
-                display: inline-block;
-                font-size: 12px;
-                width: 100%;
-                padding: 5px 12px;
-            }
-        }
+  .panelBody {
+    .panelRow {
+      text-align: left;
+      display: inline-block;
+      font-size: 12px;
+      width: 100%;
+      padding: 5px 12px;
     }
+  }
+}
 </style>

web/src/style/main.scss

@@ -1037,8 +1037,8 @@ li {
     font-size: 13px;
 }
 
-.table-button {
-    margin-right: 8px !important;
+.table-button+span {
+    margin-left: 10px !important;
 }
 
 $headerHigh: 52px;
@@ -1325,22 +1325,24 @@ $mainHight: 100vh;
             margin-bottom: 8px;
         }
     }
-}::-webkit-scrollbar-track-piece{
-     background-color: #f8f8f8;
- }
+}
+
+::-webkit-scrollbar-track-piece {
+    background-color: #f8f8f8;
+}
 
-::-webkit-scrollbar{
+::-webkit-scrollbar {
     width: 9px;
     height: 9px;
 }
 
-::-webkit-scrollbar-thumb{
+::-webkit-scrollbar-thumb {
     background-color: #dddddd;
-    background-clip:padding-box;
+    background-clip: padding-box;
     min-height: 28px;
     border-radius: 4px;
 }
 
-::-webkit-scrollbar-thumb:hover{
+::-webkit-scrollbar-thumb:hover {
     background-color: #bbb;
-}
+}

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

@@ -328,7 +328,15 @@ export default {
       if(res.code == 0){
          res.data.reworkflowProcess.nodes.map(item=>{
            if(item.assignValue){
-             item.assignValue = item.assignValue.split(",")
+             const watiUseArr = item.assignValue.split(",")
+             if(item.assignType == 'user'){
+               item.assignValue = []
+               watiUseArr.map(i => {
+                 item.assignValue.push(Number(i))
+               })
+             }else{
+                item.assignValue = watiUseArr
+             }
            }
          })
         this.demoData.nodes = res.data.reworkflowProcess.nodes

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

@@ -56,6 +56,7 @@
 
       <el-table-column label="按钮组">
         <template slot-scope="scope">
+          <el-button class="table-button" @click="useWorkflowProcess(scope.row)" size="success" >使用</el-button>
           <el-button class="table-button" @click="updateWorkflowProcess(scope.row)" size="small" type="primary">变更</el-button>
           <el-button class="table-button" @click="viewWorkflowProcess(scope.row)" size="small" type="warning">查看</el-button>
           <el-popover placement="top" width="160" v-model="scope.row.visible">
@@ -159,6 +160,14 @@ export default {
         }
       });
     },
+    async useWorkflowProcess(row){
+      this.$router.push({
+        name: "workflowUse",
+        query: {
+          id: row.id
+        }
+      });
+    },
     async viewWorkflowProcess(row) {
       this.$router.push({
         name: "workflowCreate",