工作流录入 根据id查询方法增加

server/model/wf_process.go

@@ -1,7 +1,7 @@
 package model
 
 type WorkflowProcess struct {
-	ID          string         `json:"id" gorm:"comment:流程标识;primaryKey"`
+	ID          string         `json:"id" form:"id" gorm:"comment:流程标识;primaryKey"`
 	Name        string         `json:"name" gorm:"comment:流程名称"`
 	Category    string         `json:"category" gorm:"comment:分类"`
 	Clazz       string         `json:"clazz" gorm:"comment:类型"`
@@ -9,11 +9,11 @@ type WorkflowProcess struct {
 	HideIcon    bool           `json:"hideIcon" gorm:"comment:是否隐藏图标"`
 	Description string         `json:"description" gorm:"comment:详细介绍"`
 	Nodes       []WorkflowNode `json:"nodes"` // 流程节点数据
-	Edges       []WorkflowEdge `json:"edges"` // 流程链接数据
+
 }
 
 type WorkflowNode struct {
-	ID                string  `json:"id" gorm:"comment:节点id;primaryKey"`
+	ID                string  `json:"id" form:"id" gorm:"comment:节点id;primaryKey"`
 	WorkflowProcessID string  `json:"-" gorm:"comment:流程标识"`
 	Clazz             string  `json:"clazz" gorm:"comment:节点类型"`
 	Label             string  `json:"label" gorm:"comment:节点名称"`
@@ -30,11 +30,12 @@ type WorkflowNode struct {
 	Cycle             string  `json:"cycle" gorm:"comment:循环时间"`
 	Duration          string  `json:"duration" gorm:"comment:持续时间"`
 	HideIcon          bool    `json:"hideIcon" gorm:"comment:是否隐藏图标"`
+	Edges       []WorkflowEdge `json:"edges"` // 流程链接数据
 }
 
 type WorkflowEdge struct {
-	ID                  string        `json:"id" gorm:"comment:唯一标识;primaryKey"`
-	WorkflowProcessID   string        `json:"-" gorm:"comment:流程标识"`
+	ID                  string        `json:"id" form:"id" gorm:"comment:唯一标识;primaryKey"`
+	WorkflowNodeID   string        		`json:"-" gorm:"comment:节点标识"`
 	Clazz               string        `json:"clazz" gorm:"comment:类型（线）"`
 	Source              string        `json:"source" gorm:"comment:起点节点"`
 	Target              string        `json:"target" gorm:"comment:目标节点"`

server/service/wk_process.go

@@ -58,7 +58,7 @@ func UpdateWorkflowProcess(workflowProcess *model.WorkflowProcess) (err error) {
 // @return    WorkflowProcess        WorkflowProcess
 
 func GetWorkflowProcess(id string) (err error, workflowProcess model.WorkflowProcess) {
-	err = global.GVA_DB.Where("id = ?", id).First(&workflowProcess).Error
+	err = global.GVA_DB.Preload("Nodes").Preload("Nodes.Edges").Where("id = ?", id).First(&workflowProcess).Error
 	return
 }
 

web/src/api/workflow.js

@@ -1,15 +0,0 @@
-import service from '@/utils/request'
-// @Summary 删除角色
-// @Security ApiKeyAuth
-// @accept application/json
-// @Produce application/json
-// @Param data body {authorityId uint} true "删除角色"
-// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
-// @Router /authority/deleteAuthority [post]
-export const createWorkFlow = (data) => {
-    return service({
-        url: "/workflow/createWorkFlow",
-        method: 'post',
-        data
-    })
-}

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

@@ -5,6 +5,7 @@
             <el-input style="width:90%; font-size:12px"
                       :disabled="readOnly"
                       :value="model.label"
+                       placeholder="请输入标题"
                       @input="(value) => {onChange('label', value)}" />
         </div>
         <div class="panelRow">

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

@@ -2,6 +2,14 @@
     <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"
+                          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>
@@ -15,17 +23,12 @@
                     <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.id']}}：</div>
-                <el-input style="width:90%; font-size:12px"
-                          :disabled="readOnly"
-                          :value="model.id"
-                          @input="(value) => {onChange('id', value)}" />
-            </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>
@@ -34,6 +37,7 @@
                 <el-input style="width:90%; font-size:12px"
                           :disabled="readOnly"
                           type="textarea"
+                           placeholder="请输入详情说明"
                           :value="model.description"
                           @input="(value) => {onChange('description', value)}" />
             </div>

web/src/components/gva-wfd/components/Wfd.vue

@@ -83,13 +83,10 @@
       categorys: {
         type: Array,
         default: () => ([])
-      }
-    },
-    data() {
-      return {
-        resizeFunc: ()=>{},
-        selectedModel: {},
-        processModel: {
+      },
+      processModel:{
+         type: Object,
+        default: () => ({
           id: '',
           name: '',
           category: '',
@@ -97,7 +94,13 @@
           dataObjs: [],
           signalDefs: [],
           messageDefs: [],
-        },
+        })
+      }
+    },
+    data() {
+      return {
+        resizeFunc: ()=>{},
+        selectedModel: {},
         graph:null,
         cmdPlugin: null,
       };

web/src/components/gva-wfd/locales/zh-CN.js

@@ -1,76 +1,76 @@
 export default {
-  'label': '标题',
-  'hideIcon': '隐藏图标',
-  'userTask': '审批节点',
-  'userTask.assignType': '指派类型',
-  'userTask.assignType.placeholder': '选择一个类型',
-  'userTask.assignType.assignee': '受理人',
-  'userTask.assignType.assignee.title': '受理人',
-  'userTask.assignType.assignee.placeholder': '选择受理人',
-  'userTask.assignType.person': '候选人',
-  'userTask.assignType.person.title': '候选人',
-  'userTask.assignType.person.placeholder': '选择候选人',
-  'userTask.assignType.persongroup': '候选组',
-  'userTask.assignType.persongroup.title': '候选组',
-  'userTask.assignType.persongroup.placeholder': '选择候选组',
-  'userTask.dueDate': '到期时间',
-  'userTask.dueDate.placeholder': '请选择日期',
-  'userTask.counterSign': '会签',
-  'scriptTask': '脚本节点',
-  'scriptTask.script': '脚本',
-  'javaTask': '自定义类节点',
-  'javaTask.javaClass': '类名',
-  'mailTask': '邮件节点',
-  'mailTask.to': '收件人',
-  'mailTask.subject': '标题',
-  'mailTask.content': '内容',
-  'receiveTask': '接收节点',
-  'receiveTask.waitState': '等待属性',
-  'receiveTask.stateValue': '等待值',
-  'timerEvent': '定时节点',
-  'timerEvent.cycle': '循环时间',
-  'timerEvent.cycle.placeholder': '请选择时间',
-  'timerEvent.duration': '持续时间',
-  'messageEvent': '消息节点',
-  'messageEvent.message': '消息名',
-  'signalEvent': '信号节点',
-  'signalEvent.signal': '信号名',
-  'sequenceFlow': '连接线',
-  'sequenceFlow.expression': '条件表达式',
-  'sequenceFlow.seq': '序号',
-  'sequenceFlow.reverse': '反向',
-  'startEvent': '开始节点',
-  'endEvent': '结束节点',
-  'start': '开始事件',
-  'end': '结束事件',
-  'gateway': '网关',
-  'exclusiveGateway': '排他网关',
-  'parallelGateway': '并行网关',
-  'inclusiveGateway': '包容网关',
-  'task': '活动',
-  'catch': '捕获事件',
-  'tooltip.undo': '撤销',
-  'tooltip.redo': '重复',
-  'tooltip.copy': '复制',
-  'tooltip.paste': '粘贴',
-  'tooltip.delete': '删除',
-  'tooltip.zoomIn': '放大',
-  'tooltip.zoomOut': '缩小',
-  'tooltip.zoomReset': '实际大小',
-  'tooltip.autoFit': '适应屏幕',
-  'tooltip.toFront': '移到上一层',
-  'tooltip.toBack': '移到下一层',
-  'tooltip.edit': '编辑',
-  'process': '流程',
-  'process.category': '分类',
-  'process.id': '流程标识',
-  'process.name': '流程名称',
-  'process.dataObjs': '数据对象',
-  'process.signalDefs': '信号定义',
-  'process.messageDefs': '消息定义',
-  'process.dataObjs.id': 'Id',
-  'process.dataObjs.name': '名称',
-  'process.dataObjs.type': '类型',
-  'process.dataObjs.defaultValue': '默认值',
-  'process.signalDef.scope': '作用域',
-};
+    'label': '标题',
+    'hideIcon': '隐藏图标',
+    'userTask': '审批节点',
+    'userTask.assignType': '指派类型',
+    'userTask.assignType.placeholder': '选择一个类型',
+    'userTask.assignType.assignee': '受理人',
+    'userTask.assignType.assignee.title': '受理人',
+    'userTask.assignType.assignee.placeholder': '选择受理人',
+    'userTask.assignType.person': '候选人',
+    'userTask.assignType.person.title': '候选人',
+    'userTask.assignType.person.placeholder': '选择候选人',
+    'userTask.assignType.persongroup': '候选组',
+    'userTask.assignType.persongroup.title': '候选组',
+    'userTask.assignType.persongroup.placeholder': '选择候选组',
+    'userTask.dueDate': '到期时间',
+    'userTask.dueDate.placeholder': '请选择日期',
+    'userTask.counterSign': '会签',
+    'scriptTask': '脚本节点',
+    'scriptTask.script': '脚本',
+    'javaTask': '自定义类节点',
+    'javaTask.javaClass': '类名',
+    'mailTask': '邮件节点',
+    'mailTask.to': '收件人',
+    'mailTask.subject': '标题',
+    'mailTask.content': '内容',
+    'receiveTask': '接收节点',
+    'receiveTask.waitState': '等待属性',
+    'receiveTask.stateValue': '等待值',
+    'timerEvent': '定时节点',
+    'timerEvent.cycle': '循环时间',
+    'timerEvent.cycle.placeholder': '请选择时间',
+    'timerEvent.duration': '持续时间',
+    'messageEvent': '消息节点',
+    'messageEvent.message': '消息名',
+    'signalEvent': '信号节点',
+    'signalEvent.signal': '信号名',
+    'sequenceFlow': '连接线',
+    'sequenceFlow.expression': '条件表达式',
+    'sequenceFlow.seq': '序号',
+    'sequenceFlow.reverse': '反向',
+    'startEvent': '开始节点',
+    'endEvent': '结束节点',
+    'start': '开始事件',
+    'end': '结束事件',
+    'gateway': '网关',
+    'exclusiveGateway': '排他网关',
+    'parallelGateway': '并行网关',
+    'inclusiveGateway': '包容网关',
+    'task': '活动',
+    'catch': '捕获事件',
+    'tooltip.undo': '撤销',
+    'tooltip.redo': '重复',
+    'tooltip.copy': '复制',
+    'tooltip.paste': '粘贴',
+    'tooltip.delete': '删除',
+    'tooltip.zoomIn': '放大',
+    'tooltip.zoomOut': '缩小',
+    'tooltip.zoomReset': '实际大小',
+    'tooltip.autoFit': '适应屏幕',
+    'tooltip.toFront': '移到上一层',
+    'tooltip.toBack': '移到下一层',
+    'tooltip.edit': '编辑',
+    'process': '流程',
+    'process.category': '分类',
+    'process.id': '流程标识(id)',
+    'process.name': '流程名称',
+    'process.dataObjs': '数据对象',
+    'process.signalDefs': '信号定义',
+    'process.messageDefs': '消息定义',
+    'process.dataObjs.id': 'Id',
+    'process.dataObjs.name': '名称',
+    'process.dataObjs.type': '类型',
+    'process.dataObjs.defaultValue': '默认值',
+    'process.signalDef.scope': '作用域',
+};

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

@@ -22,22 +22,26 @@
     <gva-wfd
       ref="wfd"
       :data="demoData"
+      v-if="done"
       :height="600"
       :users="users"
       :authorities="authorities"
       :groups="groups"
       :categorys="categorys"
       :lang="lang"
+      :processModel="processModel"
     />
   </div>
 </template>
 <script>
 import {
-    findWorkflowProcess
+    findWorkflowProcess,
+    createWorkflowProcess
 } from "@/api/workflowProcess";  //  此处请自行替换地址
 import gvaWfd from "@/components/gva-wfd";
 import { getUserList } from "@/api/user";
 import { getAuthorityList } from "@/api/authority";
+import edge from '../../../components/gva-wfd/shape/edge';
 export default {
   name: "Workflow",
   components: {
@@ -47,178 +51,17 @@ export default {
     return {
       visible: false,
       lang: "zh",
-      demoData: {
-        nodes: [
-          {
-            clazz: "start",
-            label: "发起请假",
-            type: "start-node",
-            shape: "start-node",
-            x: 110,
-            y: 195,
-            id: "start1603681292875",
-            style: {}
-          },
-          {
-            clazz: "parallelGateway",
-            label: "会签",
-            type: "parallel-gateway-node",
-            shape: "parallel-gateway-node",
-            x: 228,
-            y: 195,
-            id: "parallelGateway1603681296419",
-            style: {}
-          },
-          {
-            clazz: "userTask",
-            label: "审批人1",
-            type: "user-task-node",
-            shape: "user-task-node",
-            x: 372,
-            y: 84,
-            id: "userTask1603681299962",
-            style: {},
-            assignValue: 1,
-            assignType: "user"
-          },
-          {
-            clazz: "userTask",
-            label: "审批人2",
-            type: "user-task-node",
-            shape: "user-task-node",
-            x: 370,
-            y: 321,
-            id: "userTask1603681302372",
-            style: {},
-            assignValue: 2,
-            assignType: "user"
-          },
-          {
-            clazz: "parallelGateway",
-            label: "会签结果检测",
-            type: "parallel-gateway-node",
-            shape: "parallel-gateway-node",
-            x: 519,
-            y: 195,
-            id: "parallelGateway1603681338222",
-            style: {}
-          },
-          {
-            clazz: "end",
-            label: "请假失败",
-            type: "end-node",
-            shape: "end-node",
-            x: 704,
-            y: 317,
-            id: "end1603681358043",
-            style: {}
-          },
-          {
-            clazz: "end",
-            label: "请假成功",
-            type: "end-node",
-            shape: "end-node",
-            x: 706.5,
-            y: 55.5,
-            id: "end1603681360882",
-            style: {}
-          }
-        ],
-        edges: [
-          {
-            id: "flow1603681320738",
-            clazz: "flow",
-            source: "parallelGateway1603681296419",
-            target: "userTask1603681299962",
-            sourceAnchor: 0,
-            targetAnchor: 3,
-            shape: "flow-polyline-round",
-            style: {},
-            startPoint: { x: 228, y: 169, index: 0 },
-            endPoint: { x: 321.5, y: 84, index: 3 }
-          },
-          {
-            id: "flow1603681321969",
-            clazz: "flow",
-            source: "parallelGateway1603681296419",
-            target: "userTask1603681302372",
-            sourceAnchor: 2,
-            targetAnchor: 3,
-            shape: "flow-polyline-round",
-            style: {},
-            startPoint: { x: 228, y: 221, index: 2 },
-            endPoint: { x: 319.5, y: 321, index: 3 }
-          },
-          {
-            id: "flow1603681323274",
-            clazz: "flow",
-            source: "start1603681292875",
-            target: "parallelGateway1603681296419",
-            sourceAnchor: 1,
-            targetAnchor: 3,
-            shape: "flow-polyline-round",
-            style: {},
-            startPoint: { x: 138, y: 195, index: 1 },
-            endPoint: { x: 202, y: 195, index: 3 },
-            label: "发起",
-            conditionExpression: "complete"
-          },
-          {
-            id: "flow1603681341777",
-            clazz: "flow",
-            source: "userTask1603681299962",
-            target: "parallelGateway1603681338222",
-            sourceAnchor: 1,
-            targetAnchor: 3,
-            shape: "flow-polyline-round",
-            style: {},
-            startPoint: { x: 422.5, y: 84, index: 1 },
-            endPoint: { x: 493, y: 195, index: 3 }
-          },
-          {
-            id: "flow1603681343425",
-            clazz: "flow",
-            source: "userTask1603681302372",
-            target: "parallelGateway1603681338222",
-            sourceAnchor: 1,
-            targetAnchor: 3,
-            shape: "flow-polyline-round",
-            style: {},
-            startPoint: { x: 420.5, y: 321, index: 1 },
-            endPoint: { x: 493, y: 195, index: 3 }
-          },
-          {
-            id: "flow1603681362913",
-            clazz: "flow",
-            source: "parallelGateway1603681338222",
-            target: "end1603681360882",
-            sourceAnchor: 0,
-            targetAnchor: 2,
-            shape: "flow-polyline-round",
-            style: {},
-            startPoint: { x: 519, y: 169, index: 0 },
-            endPoint: { x: 678.5, y: 55.5, index: 2 },
-            conditionExpression: "complete",
-            label: "所有人同意"
-          },
-          {
-            id: "flow1603681392729",
-            clazz: "flow",
-            source: "parallelGateway1603681338222",
-            target: "end1603681358043",
-            sourceAnchor: 2,
-            targetAnchor: 2,
-            shape: "flow-polyline-round",
-            style: {},
-            startPoint: { x: 519, y: 221, index: 2 },
-            endPoint: { x: 676, y: 317, index: 2 },
-            conditionExpression: "reject",
-            label: "任何一人拒绝"
-          }
-        ],
-        combos: [],
-        groups: []
-      },
+      done:false,
+      demoData: {},
+      processModel:{
+          id: '',
+          name: '',
+          category: '',
+          clazz: 'process',
+          dataObjs: [],
+          signalDefs: [],
+          messageDefs: [],
+        },
       users: [],
       authorities: [],
       groups: [
@@ -235,11 +78,37 @@ export default {
     };
   },
   methods: {
-    save() {
+    async save() {
       this.visible = false;
-      console.log(this.$refs["wfd"].graph.save());
-      console.log(this.$refs["wfd"].processModel);
-      console.log(JSON.stringify(this.$refs["wfd"].graph.save()));
+      const obj = this.$refs["wfd"].graph.save()
+      const processModel = this.processModel
+      const nodeMap={}
+
+      obj.edges.map(item=>{
+        if(nodeMap[item.source]){
+          nodeMap[item.source].push(item)
+        }else{
+          nodeMap[item.source] = [item]
+        }
+      })
+      obj.nodes.map(item=>{
+        item.edges = nodeMap[item.id]
+      })
+      processModel.nodes = obj.nodes
+      if(!processModel.id){
+        this.$message({
+         type:"error",
+         message:"流程ID为必填项(点击空白处录入流程基本信息)"
+       })
+       return
+      }
+     const res = await createWorkflowProcess(processModel)
+     if(res.code == 0){
+       this.$message({
+         type:"success",
+         message:"创建成功"
+       })
+     }
     },
     saveXML() {
       console.log(this.$refs["wfd"].graph.saveXML());
@@ -264,9 +133,23 @@ export default {
         });
       });
     }
-    if(this.$route.params.ID){
-      const res = await findWorkflowProcess({ ID: this.$route.params.ID });
-      console.log(res.data)
+    if(this.$route.query.id){
+      const res = await findWorkflowProcess({ id: this.$route.query.id });
+      this.disabled = this.$route.query.type == "view"
+      if(res.code == 0){
+        const nodes = []
+        const edges = []
+        res.data.reworkflowProcess.nodes.map(item=>{
+          edges.push(...item.edges)
+          delete item.edges
+          nodes.push(item)
+        })
+        delete res.data.reworkflowProcess.nodes
+        this.demoData = {edges,nodes}
+        this.processModel = res.data.reworkflowProcess
+        this.done = true
+      }
+      console.log(this.demoData)
     }
   }
 };

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

@@ -33,9 +33,6 @@
       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> 
     
@@ -136,7 +133,7 @@ export default {
         const ids = []
         this.multipleSelection &&
           this.multipleSelection.map(item => {
-            ids.push(item.ID)
+            ids.push(item.id)
           })
         const res = await deleteWorkflowProcessByIds({ ids })
         if (res.code == 0) {
@@ -149,8 +146,8 @@ export default {
         }
       },
     async updateWorkflowProcess(row) {
-      this.$router.push({name:"workflowCreate",params:{
-        ID:row.ID,
+      this.$router.push({name:"workflowCreate",query:{
+        id:row.id,
         type:'edit'
       }})
     },
@@ -168,7 +165,7 @@ export default {
     },
     async deleteWorkflowProcess(row) {
       this.visible = false;
-      const res = await deleteWorkflowProcess({ ID: row.ID });
+      const res = await deleteWorkflowProcess({ id: row.id });
       if (res.code == 0) {
         this.$message({
           type: "success",