1

web/package.json

@@ -10,8 +10,14 @@
   "dependencies": {
     "@babel/polyfill": "^7.12.1",
     "@element-plus/icons": "0.0.11",
+    "@logicflow/core": "^0.4.13",
+    "@logicflow/extension": "^0.4.13",
     "@tinymce/tinymce-vue": "^4.0.5",
     "axios": "^0.19.2",
+    "bpmn-js": "^4.0.4",
+    "bpmn-js-properties-panel": "^0.32.2",
+    "bpmn-moddle": "^6.0.0",
+    "camunda-bpmn-moddle": "^6.1.1",
     "core-js": "^3.6.5",
     "echarts": "4.9.0",
     "element-plus": "^1.1.0-beta.24",
@@ -21,12 +27,15 @@
     "path": "^0.12.7",
     "qs": "^6.8.0",
     "quill": "^1.3.7",
+    "raw-loader": "^4.0.2",
     "screenfull": "^5.0.2",
     "script-ext-html-webpack-plugin": "^2.1.4",
     "spark-md5": "^3.0.1",
     "tinymce": "^5.10.2",
-    "vue": "^3.2.0",
+    "vue": "^3.2.4",
     "vue-baidu-map": "^0.21.22",
+    "vue-bpmn": "^0.3.0",
+    "vue-json-pretty": "^1.8.2",
     "vue-particle-line": "^0.1.4",
     "vue-quill-editor": "^3.0.6",
     "vue-router": "^4.0.0-0",

web/src/api/comment.js

@@ -0,0 +1,43 @@
+// 文章/评论管理api
+import service from '@/utils/request'
+
+// @Tags api
+// @Summary 查询文档评论 分页
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const getdiscussfilemsg = (data) => {
+  return service({
+    url: '/archive/getdiscussfilemsg',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 文章 分页
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const archivefilelist = (data) => {
+    return service({
+      url: '/archive/archivefilelist',
+      method: 'post',
+      data
+    })
+  }
+
+

web/src/api/dataEntry.js

@@ -0,0 +1,460 @@
+// 数据提报
+import service from '@/utils/request'
+
+// @Tags api
+// @Summary 查询考核类别 分页
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const dutyclasslist = (data) => {
+  return service({
+    url: '/duty/dutyclasslist',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 添加考核类别 分页
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const adddutyclass = (data) => {
+    return service({
+      url: '/duty/adddutyclass',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 查询考核类别详情 分页
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const getdutyclassinfo = (data) => {
+    return service({
+      url: '/duty/getdutyclassinfo',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 编辑考核类别内容
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const eitedutyclassinfo = (data) => {
+    return service({
+      url: '/duty/eitedutyclassinfo',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 删除或改变考核类别状态
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const statedutyclass = (data) => {
+    return service({
+      url: '/duty/statedutyclass',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 考核项目列表
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const assessList = (data) => {
+    return service({
+      url: '/duty/assessList',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 添加考核项目
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const addassessinfo = (data) => {
+    return service({
+      url: '/duty/addassessinfo',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 获取考核项目详情
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const getassessinfo = (data) => {
+    return service({
+      url: '/duty/getassessinfo',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 修改考核项目内容
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const eiteassessinfo = (data) => {
+    return service({
+      url: '/duty/eiteassessinfo',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 删除或变更考核项目状态
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const eiteassessstate = (data) => {
+    return service({
+      url: '/duty/eiteassessstate',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 具体职责列表
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const dutylist = (data) => {
+    return service({
+      url: '/duty/dutylist',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 添加具体职责
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const adddutyinfo = (data) => {
+    return service({
+      url: '/duty/adddutyinfo',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 获取具体职责详情
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const getdutyinfo = (data) => {
+    return service({
+      url: '/duty/getdutyinfo',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 编辑职责详情
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const eitedutyinfo = (data) => {
+    return service({
+      url: '/duty/eitedutyinfo',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 修改状态或删除具体职责
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const eitedutystate = (data) => {
+    return service({
+      url: '/duty/eitedutystate',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 获取集团详情
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const grouplist = (data) => {
+  return service({
+    url: '/group/grouplist',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 获取员工列表
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const stafflist = (data) => {
+  return service({
+    url: '/staff/stafflist',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 部门考核项目列表
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const specdutylist = (data) => {
+  return service({
+    url: '/duty/specdutylist',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 添加部门考核项目
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const addspecdutyinfo = (data) => {
+  return service({
+    url: '/duty/addspecdutyinfo',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 获取部门考核项目详情
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const getspecdutyinfo = (data) => {
+  return service({
+    url: '/duty/getspecdutyinfo',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 编辑部门考核项目详情
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const eitespecdutyinfo = (data) => {
+  return service({
+    url: '/duty/eitespecdutyinfo',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 修改状态或删除具体部门考核项目
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const eitespecdutystate = (data) => {
+  return service({
+    url: '/duty/eitespecdutystate',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 添加部门考核项目详情（副本）
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const adddepartdutyinfo = (data) => {
+  return service({
+    url: '/duty/adddepartdutyinfo',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 修改具体部门考核项目详情(副本)
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const eitedepartdutyinfo = (data) => {
+  return service({
+    url: '/duty/eitedepartdutyinfo',
+    method: 'post',
+    data
+  })
+}
+

web/src/api/documentation.js

@@ -0,0 +1,156 @@
+// 健康上报api
+import service from '@/utils/request'
+
+// @Tags api
+// @Summary 获取文档栏目分类 不分页
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const archivetypelist = (data) => {
+  return service({
+    url: 'archive/archivetypelist',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 新建栏目
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const addarchivetype = (data) => {
+    return service({
+      url: '/archive/addarchivetype',
+      method: 'post',
+      data
+    })
+  }
+// @Tags api
+// @Summary 获取单个栏目详细信息 
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const getarchiveinfo = (data) => {
+  return service({
+    url: '/archive/getarchiveinfo',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 改变栏目状态
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const eitearchivestate = (data) => {
+  return service({
+    url: '/archive/eitearchivestate',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 修改栏目信息
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const eitearchiveinfo = (data) => {
+  return service({
+    url: '/archive/eitearchiveinfo',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 添加被通知人信息
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const addnoticeuser = (data) => {
+  return service({
+    url: '/wechathealth/addnoticeuser',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 修改被通知人信息
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const eitenoticeuser = (data) => {
+  return service({
+    url: '/wechathealth/eitenoticeuser',
+    method: 'post',
+    data
+  })
+}
+// @Tags api
+// @Summary 删除被通知人信息
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body modelInterface.PageInfo true "分页获取用户列表"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /api/getApiList [post]
+// {
+//  page     int
+//	pageSize int
+// }
+export const delnoticeuser = (data) => {
+  return service({
+    url: '/wechathealth/delnoticeuser',
+    method: 'post',
+    data
+  })
+}
+

web/src/api/group.js

@@ -115,4 +115,34 @@ export const grouplist = (data) => {
     data
   })
 }
+// @Tags Api
+// @Summary 获取集团架构（集团+分厂）
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body dbModel.Api true "获取集团架构"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /group/grouplist [get]
+export const getgroupdepartmap = (data) => {
+  return service({
+    url: '/group/getgroupdepartmap',
+    method: 'post',
+    data
+  })
+}
+// @Tags Api
+// @Summary 获取集团架构人员信息对照表
+// @Security ApiKeyAuth
+// @accept application/json
+// @Produce application/json
+// @Param data body dbModel.Api true "获取集团架构"
+// @Success 200 {string} json "{"success":true,"data":{},"msg":"获取成功"}"
+// @Router /group/grouplist [get]
+export const getgroupuser = (data) => {
+  return service({
+    url: '/group/getgroupuser',
+    method: 'post',
+    data
+  })
+}
 

web/src/assets/diagram1.bpmn

@@ -0,0 +1,202 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<bpmn:definitions xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:bpmn="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:dc="http://www.omg.org/spec/DD/20100524/DC" xmlns:camunda="http://camunda.org/schema/1.0/bpmn" xmlns:di="http://www.omg.org/spec/DD/20100524/DI" id="Definitions_1" targetNamespace="http://bpmn.io/schema/bpmn">
+  <bpmn:process id="test" name="test" isExecutable="true">
+    <bpmn:startEvent id="StartEvent_1">
+      <bpmn:outgoing>SequenceFlow_07f1sez</bpmn:outgoing>
+    </bpmn:startEvent>
+    <bpmn:exclusiveGateway id="ExclusiveGateway_0io7r1h" name="删选会员">
+      <bpmn:incoming>SequenceFlow_07f1sez</bpmn:incoming>
+      <bpmn:outgoing>SequenceFlow_15ow6gv</bpmn:outgoing>
+      <bpmn:outgoing>SequenceFlow_0d1io4v</bpmn:outgoing>
+      <bpmn:outgoing>SequenceFlow_1rcakng</bpmn:outgoing>
+    </bpmn:exclusiveGateway>
+    <bpmn:sequenceFlow id="SequenceFlow_07f1sez" sourceRef="StartEvent_1" targetRef="ExclusiveGateway_0io7r1h" />
+    <bpmn:sequenceFlow id="SequenceFlow_15ow6gv" name="yes" sourceRef="ExclusiveGateway_0io7r1h" targetRef="ExclusiveGateway_17g4cww">
+      <bpmn:conditionExpression xsi:type="bpmn:tFormalExpression">isTrue</bpmn:conditionExpression>
+    </bpmn:sequenceFlow>
+    <bpmn:serviceTask id="ServiceTask_tagDelegate_0bjokq0" name="添加标签" camunda:delegateExpression="addtag">
+      <bpmn:extensionElements>
+        <camunda:properties>
+          <camunda:property name="tagnames" value="老人" />
+          <camunda:property name="tagnames1" value="老人1" />
+        </camunda:properties>
+      </bpmn:extensionElements>
+      <bpmn:incoming>SequenceFlow_0y1iisj</bpmn:incoming>
+      <bpmn:outgoing>SequenceFlow_1gwuen1</bpmn:outgoing>
+    </bpmn:serviceTask>
+    <bpmn:endEvent id="EndEvent_0nqbnar" name="结束">
+      <bpmn:incoming>SequenceFlow_1gwuen1</bpmn:incoming>
+      <bpmn:incoming>SequenceFlow_0dissda</bpmn:incoming>
+    </bpmn:endEvent>
+    <bpmn:exclusiveGateway id="ExclusiveGateway_17g4cww" name="筛选未发券会员">
+      <bpmn:incoming>SequenceFlow_15ow6gv</bpmn:incoming>
+      <bpmn:outgoing>SequenceFlow_0jo6785</bpmn:outgoing>
+      <bpmn:outgoing>SequenceFlow_0dissda</bpmn:outgoing>
+    </bpmn:exclusiveGateway>
+    <bpmn:sequenceFlow id="SequenceFlow_0jo6785" name="yes" sourceRef="ExclusiveGateway_17g4cww" targetRef="ServiceTask_appPushDelegate_0wulpvm">
+      <bpmn:conditionExpression xsi:type="bpmn:tFormalExpression">sendapp</bpmn:conditionExpression>
+    </bpmn:sequenceFlow>
+    <bpmn:serviceTask id="ServiceTask_appPushDelegate_0wulpvm" name="发送指定优惠券" camunda:expression="apppush" camunda:resultVariable="app">
+      <bpmn:extensionElements>
+        <camunda:properties>
+          <camunda:property name="tagNames" value="test" />
+        </camunda:properties>
+      </bpmn:extensionElements>
+      <bpmn:incoming>SequenceFlow_0jo6785</bpmn:incoming>
+      <bpmn:outgoing>SequenceFlow_0y1iisj</bpmn:outgoing>
+    </bpmn:serviceTask>
+    <bpmn:sequenceFlow id="SequenceFlow_0y1iisj" sourceRef="ServiceTask_appPushDelegate_0wulpvm" targetRef="ServiceTask_tagDelegate_0bjokq0" />
+    <bpmn:sequenceFlow id="SequenceFlow_1gwuen1" sourceRef="ServiceTask_tagDelegate_0bjokq0" targetRef="EndEvent_0nqbnar" />
+    <bpmn:exclusiveGateway id="ExclusiveGateway_19yj3fu" name="筛选发短信的会员">
+      <bpmn:incoming>SequenceFlow_0d1io4v</bpmn:incoming>
+      <bpmn:outgoing>SequenceFlow_0yptzdv</bpmn:outgoing>
+      <bpmn:outgoing>SequenceFlow_17zsv75</bpmn:outgoing>
+    </bpmn:exclusiveGateway>
+    <bpmn:sequenceFlow id="SequenceFlow_0d1io4v" name="yes" sourceRef="ExclusiveGateway_0io7r1h" targetRef="ExclusiveGateway_19yj3fu">
+      <bpmn:conditionExpression xsi:type="bpmn:tFormalExpression">isSend</bpmn:conditionExpression>
+    </bpmn:sequenceFlow>
+    <bpmn:serviceTask id="ServiceTask_unTagDelegate_1n4e6i4" name="移除指定标签" camunda:expression="UNtag" camunda:resultVariable="UNtag">
+      <bpmn:extensionElements>
+        <camunda:properties>
+          <camunda:property name="remove" value="true" />
+        </camunda:properties>
+      </bpmn:extensionElements>
+      <bpmn:incoming>SequenceFlow_1rcakng</bpmn:incoming>
+      <bpmn:outgoing>SequenceFlow_0w7hugc</bpmn:outgoing>
+    </bpmn:serviceTask>
+    <bpmn:sequenceFlow id="SequenceFlow_1rcakng" sourceRef="ExclusiveGateway_0io7r1h" targetRef="ServiceTask_unTagDelegate_1n4e6i4" />
+    <bpmn:endEvent id="EndEvent_116t3md">
+      <bpmn:incoming>SequenceFlow_0w7hugc</bpmn:incoming>
+    </bpmn:endEvent>
+    <bpmn:sequenceFlow id="SequenceFlow_0w7hugc" sourceRef="ServiceTask_unTagDelegate_1n4e6i4" targetRef="EndEvent_116t3md" />
+    <bpmn:serviceTask id="ServiceTask_shortMessageDelegate_03kenwi" name="f发送指定短信" camunda:delegateExpression="senmessage">
+      <bpmn:incoming>SequenceFlow_0yptzdv</bpmn:incoming>
+      <bpmn:outgoing>SequenceFlow_02m7s7p</bpmn:outgoing>
+    </bpmn:serviceTask>
+    <bpmn:sequenceFlow id="SequenceFlow_0yptzdv" name="yes" sourceRef="ExclusiveGateway_19yj3fu" targetRef="ServiceTask_shortMessageDelegate_03kenwi">
+      <bpmn:conditionExpression xsi:type="bpmn:tFormalExpression">senmessage</bpmn:conditionExpression>
+    </bpmn:sequenceFlow>
+    <bpmn:endEvent id="EndEvent_0f4cb85">
+      <bpmn:incoming>SequenceFlow_02m7s7p</bpmn:incoming>
+      <bpmn:incoming>SequenceFlow_17zsv75</bpmn:incoming>
+    </bpmn:endEvent>
+    <bpmn:sequenceFlow id="SequenceFlow_02m7s7p" sourceRef="ServiceTask_shortMessageDelegate_03kenwi" targetRef="EndEvent_0f4cb85" />
+    <bpmn:sequenceFlow id="SequenceFlow_17zsv75" sourceRef="ExclusiveGateway_19yj3fu" targetRef="EndEvent_0f4cb85" />
+    <bpmn:sequenceFlow id="SequenceFlow_0dissda" sourceRef="ExclusiveGateway_17g4cww" targetRef="EndEvent_0nqbnar" />
+  </bpmn:process>
+  <bpmndi:BPMNDiagram id="BPMNDiagram_1">
+    <bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="test">
+      <bpmndi:BPMNShape id="_BPMNShape_StartEvent_2" bpmnElement="StartEvent_1">
+        <dc:Bounds x="102" y="242" width="36" height="36" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="ExclusiveGateway_0io7r1h_di" bpmnElement="ExclusiveGateway_0io7r1h" isMarkerVisible="true">
+        <dc:Bounds x="255" y="235" width="50" height="50" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="258" y="295" width="44" height="14" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNEdge id="SequenceFlow_07f1sez_di" bpmnElement="SequenceFlow_07f1sez">
+        <di:waypoint x="138" y="260" />
+        <di:waypoint x="255" y="260" />
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNEdge id="SequenceFlow_15ow6gv_di" bpmnElement="SequenceFlow_15ow6gv">
+        <di:waypoint x="280" y="235" />
+        <di:waypoint x="280" y="120" />
+        <di:waypoint x="335" y="120" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="287" y="175" width="17" height="14" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNShape id="ServiceTask_tagDelegate_0bjokq0_di" bpmnElement="ServiceTask_tagDelegate_0bjokq0">
+        <dc:Bounds x="660" y="80" width="80" height="80" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="EndEvent_0nqbnar_di" bpmnElement="EndEvent_0nqbnar">
+        <dc:Bounds x="882" y="102" width="36" height="36" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="889" y="145" width="22" height="14" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNShape id="ExclusiveGateway_17g4cww_di" bpmnElement="ExclusiveGateway_17g4cww" isMarkerVisible="true">
+        <dc:Bounds x="335" y="95" width="50" height="50" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="324" y="152" width="77" height="14" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNEdge id="SequenceFlow_0jo6785_di" bpmnElement="SequenceFlow_0jo6785">
+        <di:waypoint x="385" y="120" />
+        <di:waypoint x="510" y="120" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="439" y="102" width="17" height="14" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNShape id="ServiceTask_appPushDelegate_0wulpvm_di" bpmnElement="ServiceTask_appPushDelegate_0wulpvm">
+        <dc:Bounds x="510" y="80" width="80" height="80" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNEdge id="SequenceFlow_0y1iisj_di" bpmnElement="SequenceFlow_0y1iisj">
+        <di:waypoint x="590" y="120" />
+        <di:waypoint x="660" y="120" />
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNEdge id="SequenceFlow_1gwuen1_di" bpmnElement="SequenceFlow_1gwuen1">
+        <di:waypoint x="740" y="120" />
+        <di:waypoint x="882" y="120" />
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNShape id="ExclusiveGateway_19yj3fu_di" bpmnElement="ExclusiveGateway_19yj3fu" isMarkerVisible="true">
+        <dc:Bounds x="405" y="235" width="50" height="50" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="386" y="211" width="88" height="14" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNEdge id="SequenceFlow_0d1io4v_di" bpmnElement="SequenceFlow_0d1io4v">
+        <di:waypoint x="305" y="260" />
+        <di:waypoint x="405" y="260" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="347" y="242" width="17" height="14" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNShape id="ServiceTask_unTagDelegate_1n4e6i4_di" bpmnElement="ServiceTask_unTagDelegate_1n4e6i4">
+        <dc:Bounds x="340" y="370" width="80" height="80" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNEdge id="SequenceFlow_1rcakng_di" bpmnElement="SequenceFlow_1rcakng">
+        <di:waypoint x="280" y="285" />
+        <di:waypoint x="280" y="410" />
+        <di:waypoint x="340" y="410" />
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNShape id="EndEvent_116t3md_di" bpmnElement="EndEvent_116t3md">
+        <dc:Bounds x="462" y="392" width="36" height="36" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNEdge id="SequenceFlow_0w7hugc_di" bpmnElement="SequenceFlow_0w7hugc">
+        <di:waypoint x="420" y="410" />
+        <di:waypoint x="462" y="410" />
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNShape id="ServiceTask_shortMessageDelegate_03kenwi_di" bpmnElement="ServiceTask_shortMessageDelegate_03kenwi">
+        <dc:Bounds x="540" y="230" width="80" height="80" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNEdge id="SequenceFlow_0yptzdv_di" bpmnElement="SequenceFlow_0yptzdv">
+        <di:waypoint x="455" y="260" />
+        <di:waypoint x="540" y="260" />
+        <bpmndi:BPMNLabel>
+          <dc:Bounds x="489" y="242" width="17" height="14" />
+        </bpmndi:BPMNLabel>
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNShape id="EndEvent_0f4cb85_di" bpmnElement="EndEvent_0f4cb85">
+        <dc:Bounds x="712" y="252" width="36" height="36" />
+      </bpmndi:BPMNShape>
+      <bpmndi:BPMNEdge id="SequenceFlow_02m7s7p_di" bpmnElement="SequenceFlow_02m7s7p">
+        <di:waypoint x="620" y="270" />
+        <di:waypoint x="712" y="270" />
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNEdge id="SequenceFlow_17zsv75_di" bpmnElement="SequenceFlow_17zsv75">
+        <di:waypoint x="430" y="285" />
+        <di:waypoint x="430" y="360" />
+        <di:waypoint x="730" y="360" />
+        <di:waypoint x="730" y="288" />
+      </bpmndi:BPMNEdge>
+      <bpmndi:BPMNEdge id="SequenceFlow_0dissda_di" bpmnElement="SequenceFlow_0dissda">
+        <di:waypoint x="360" y="95" />
+        <di:waypoint x="360" y="-10" />
+        <di:waypoint x="900" y="-10" />
+        <di:waypoint x="900" y="102" />
+      </bpmndi:BPMNEdge>
+    </bpmndi:BPMNPlane>
+  </bpmndi:BPMNDiagram>
+</bpmn:definitions>

web/src/assets/global.css

@@ -0,0 +1,36 @@
+body{
+    margin: 0;
+    padding: 0;
+}
+
+/*路由切换动画*/
+.router-fade-enter-active {
+    transition: all 0.3s cubic-bezier(0.6, 0.5, 0.3, 0.1);
+}
+
+.router-fade-leave-active {
+    transition: all 0.3s cubic-bezier(0.5, 0.5, 0.5, 0.5);
+}
+
+.router-fade-enter {
+    transform: translateX(-10px);
+    opacity: 0;
+}
+
+.router-fade-leave-to {
+    transform: translateX(50px);
+    opacity: 0;
+}
+
+.fl {
+    float: left;
+}
+.fr {
+    float: right;
+}
+.tl{
+    text-align: left;
+}
+.tr{
+    text-align: right;
+}

web/src/components/complexTransfer/index.vue

@@ -0,0 +1,16 @@
+<template>
+<!-- 复杂穿梭框（用于选择人员） -->
+    <div>
+        
+    </div>
+</template>
+
+<script>
+    export default {
+        
+    }
+</script>
+
+<style lang="scss" scoped>
+
+</style>

web/src/components/dutyDialog/index.vue

@@ -0,0 +1,137 @@
+<template>
+<!-- 具体职责选择框 -->
+    <div>
+        <div>
+            <el-button size="small" @click="showDialog()">选择具体职责</el-button>
+        </div>
+        
+        <el-dialog title="提示" v-model="dialogVisible" width="60%" :before-close="handleClose">
+            <div class="gva-search-box">
+      <el-form ref="searchForm" :inline="true" :model="searchInfo">
+        <el-form-item label="所属考核项目">
+          <span>
+            <el-tag v-if="childInfo.title!=''">{{childInfo.title}}</el-tag>
+            <projectDialog @checkedInfo="getCheckedInfo"></projectDialog>
+          </span>
+          
+        </el-form-item>
+        <el-form-item label="考核项目名称">
+          <el-input
+            placeholder="请输入名称"
+            v-model="dutySearchInfo.title"
+            clearable>
+          </el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
+          <el-button size="mini" icon="el-icon-refresh" @click="onReset">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="gva-table-box">
+      <el-table :data="dutyList" @sort-change="sortChange" @selection-change="handleSelectionChange">
+        <el-table-column align="left" label="所属考核项目" prop="parentTitle"/>
+        <el-table-column align="left" label="具体职责名称" prop="title"/>
+        <el-table-column align="left" label="考核部门" prop="dumpTitle"/>
+        <el-table-column align="left" label="考核人" prop="username"/>
+        <el-table-column align="left" fixed="right" label="操作" width="200">
+          <template #default="scope">
+            <el-button type="primary" round  @click="checked(scope.row)">选中</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="gva-pagination">
+        <el-pagination
+          :current-page="dutySearchInfo.page"
+          :page-size="dutySearchInfo.pageSize"
+          :page-sizes="[10, 30, 50, 100]"
+          :total="total"
+          layout="total, sizes, prev, pager, next, jumper"
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+        />
+      </div>
+
+    </div>
+        </el-dialog>
+        
+    </div>
+</template>
+
+<script>
+import {
+  dutylist,
+} from '@/api/dataEntry'
+import projectDialog from '@/components/projectDialog/index.vue'
+    export default {
+        components: {
+    projectDialog
+  },
+        data() {
+            return {
+                
+                childInfo:{
+                    title:'',
+                },
+                total:'',
+                searchList:{
+                    page:1,
+                    pagesize:10000,
+                },
+                dutyclasslist:{},
+                dutySearchInfo:{
+                    page: 1,
+                    pageSize: 10,
+                    state:1,
+                },
+              dialogVisible: false,
+              dutyList:null,
+            }
+        },
+        created () {
+          this.getdutyList();  
+        },
+        methods: {
+            // 获取选中组件值
+    getCheckedInfo(data){
+      this.childInfo=data
+    },
+            // 条件搜索前端看此方法
+            onSubmit() {
+                this.dutySearchInfo.page = 1
+                this.dutySearchInfo.pageSize = 10
+                this.dutySearchInfo.parentId=this.childInfo.outId
+                this.getdutyList()
+            },
+            // pagesize改变
+            handleSizeChange(val) {
+                this.dutySearchInfo.pageSize=val
+            },
+            // 页码改变
+            handleCurrentChange(val) {
+                this.dutySearchInfo.page=val
+            },
+            // 点击按钮事件
+            showDialog(){
+                this.dialogVisible=true;
+            },
+            // 获取具体职责列表
+            async getdutyList(){
+                const res = await dutylist(this.dutySearchInfo)
+                this.dutyList=res.data.list;
+                this.dutySearchInfo.page=res.data.page;
+                this.dutySearchInfo.pageSize=res.data.pageSize;
+                this.total=res.data.total;
+            },
+            // 选中
+            checked(row){
+                this.$emit('checkedInfo',row)
+                this.dialogVisible=false
+            },
+        }
+    }
+</script>
+
+<style lang="scss" scoped>
+
+</style>

web/src/components/projectDialog/index.vue

@@ -0,0 +1,149 @@
+<template>
+    <div>
+        <div>
+            <el-button size="small" @click="showDialog()">选择考核项目</el-button>
+        </div>
+        
+        <el-dialog title="提示" v-model="dialogVisible" width="60%" :before-close="handleClose">
+            <div class="gva-search-box">
+      <el-form ref="searchForm" :inline="true" :model="searchInfo">
+        <el-form-item label="考核项目名称">
+          <el-input
+            placeholder="请输入名称"
+            v-model="projectSearchInfo.title"
+            clearable>
+          </el-input>
+        </el-form-item>
+        <!-- <el-form-item label="考核项目状态">
+          <el-select v-model="projectSearchInfo.state" clearable placeholder="请选择状态">
+            <el-option :value=1 label="正常">正常</el-option>
+            <el-option :value=2 label="禁止">禁止</el-option>
+          </el-select>
+        </el-form-item> -->
+        <el-form-item label="所属考核类别">
+          <el-select v-model="projectSearchInfo.parentId" clearable placeholder="请选择状态">
+             <el-option
+              v-for="item in dutyclasslist"
+              :key="item.outId"
+              :label="item.title"
+              :value="item.outId">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
+          <!-- <el-button size="mini" icon="el-icon-refresh" @click="onReset">重置</el-button> -->
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="gva-table-box">
+      <el-table :data="assessList" @sort-change="sortChange" @selection-change="handleSelectionChange">
+        <!-- <el-table-column
+          type="selection"
+          width="55"
+        /> -->
+        <el-table-column align="left" label="所属考核类别" prop="parentTitle"/>
+        <el-table-column align="left" label="考核项目名称" prop="title"/>
+        <el-table-column align="left" label="考核项目说明" prop="content"/>
+        <el-table-column align="left" fixed="right" label="操作" width="200">
+          <template #default="scope">
+            <el-button type="primary" round  @click="checked(scope.row)">选中</el-button>
+            
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="gva-pagination">
+        <el-pagination
+          :current-page="projectSearchInfo.page"
+          :page-size="projectSearchInfo.pageSize"
+          :page-sizes="[10, 30, 50, 100]"
+          :total="total"
+          layout="total, sizes, prev, pager, next, jumper"
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+        />
+      </div>
+    </div>
+           <!-- <span slot="footer" class="dialog-footer">
+            <el-button @click="dialogVisible = false">取 消</el-button>
+            <el-button type="primary" @click="dialogVisible = false">确 定</el-button>
+           </span> -->
+        </el-dialog>
+        
+    </div>
+</template>
+
+<script>
+import {
+  dutyclasslist,
+  assessList,
+} from '@/api/dataEntry'
+    export default {
+        data() {
+            return {
+                projectTitle:'',
+                total:'',
+                searchList:{
+                    page:1,
+                    pagesize:10000,
+                },
+                dutyclasslist:{},
+                projectSearchInfo:{
+                    page: 1,
+                    pageSize: 10,
+                    state:1,
+                },
+              dialogVisible: false,
+              assessList:null,
+            }
+        },
+        created () {
+          this.getProjectList();  
+          this.getDutyclasslist();
+        },
+        methods: {
+            // 条件搜索前端看此方法
+            onSubmit() {
+                this.page = 1
+                this.pageSize = 10
+                
+                this.getProjectList()
+            },
+            // pagesize改变
+            handleSizeChange(val) {
+                this.projectSearchInfo.pageSize=val
+            },
+            // 页码改变
+            handleCurrentChange(val) {
+                this.projectSearchInfo.page=val
+            },
+            // 获取考核类别列表
+            async getDutyclasslist(){
+                const res = await dutyclasslist(this.searchList)
+                this.dutyclasslist=res.data.list;
+            },
+            // 点击按钮事件
+            showDialog(){
+                this.dialogVisible=true;
+            },
+            // 获取考核项目列表
+            async getProjectList(){
+                const res = await assessList(this.projectSearchInfo)
+                this.assessList=res.data.list;
+                this.projectSearchInfo.page=res.data.page;
+                this.projectSearchInfo.pageSize=res.data.pageSize;
+                this.total=res.data.total;
+            },
+            // 选中
+            checked(row){
+                this.projectTitle=row.title;
+                this.$emit('checkedInfo',row)
+                this.dialogVisible=false
+            },
+        }
+    }
+</script>
+
+<style lang="scss" scoped>
+
+</style>

web/src/main.js

@@ -17,7 +17,14 @@ import '@/permission'
 import { store } from '@/store/index'
 
 import App from './App.vue'
-
+// bpmn
+/*左边工具栏以及编辑节点的样式*/
+import "bpmn-js/dist/assets/diagram-js.css";
+import "bpmn-js/dist/assets/bpmn-font/css/bpmn.css";
+import "bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css";
+import "bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css";
+/*右边工具栏样式*/
+import "bpmn-js-properties-panel/dist/assets/bpmn-js-properties-panel.css";
 
 
 

web/src/mixins/infoList.js

@@ -8,6 +8,7 @@ export default {
       total: 10,
       pageSize: 10,
       tableData: [],
+      tabledata:[],
       searchInfo: {}
     }
   },
@@ -59,6 +60,10 @@ export default {
         this.page = table.data.page
         this.pageSize = table.data.pageSize
         this.pagesize = table.data.pagesize
+        this.tabledata = table.data.data
+        // if (table.data.data!='') {
+        //   this.tableData = table.data.data
+        // }
       }
       if (table.code === 200) {
         this.tableData = table.data

web/src/permission.js

@@ -3,7 +3,7 @@ import { store } from '@/store/index'
 import getPageTitle from '@/utils/page'
 let asyncRouterFlag = 0
 
-const whiteList = ['Login', 'Init']
+const whiteList = ['Login', 'Init','Userlogin']
 
 const getRouter = async() => {
   await store.dispatch('router/SetAsyncRouter')
@@ -46,6 +46,7 @@ router.beforeEach(async(to, from, next) => {
     }
     // 不在白名单中并且未登陆的时候
     if (!token) {
+      console.log("我跳")
       next({
         name: 'Login',
         query: {

web/src/router/index.js

@@ -13,6 +13,11 @@ const routes = [{
   path: '/login',
   name: 'Login',
   component: () => import('@/view/login/index.vue')
+},
+{
+  path: '/userlogin',
+  name: 'Userlogin',
+  component: () => import('@/view/login/userLogin.vue')
 }
 ]
 

web/src/view/login/index.vue

@@ -57,6 +57,9 @@
             <!-- <el-button type="primary" style="width: 46%" @click="checkInit"
               >前往初始化</el-button
             > -->
+            <!-- <el-button type="primary" style="width: 46%" @click="goUser"
+              >前往用户端登录</el-button
+            > -->
             <el-button
               type="primary"
               style="width: 46%; margin-left: 25%"
@@ -140,6 +143,9 @@ export default {
   },
   methods: {
     ...mapActions('user', ['LoginIn']),
+    goUser(){
+      this.$router.push({ name: 'Userlogin' })
+    },
     async checkInit() {
       const res = await checkDB()
       if (res.code === 0) {

web/src/view/login/userLogin.vue

@@ -0,0 +1,178 @@
+<template>
+  <div id="userLayout">
+    <div class="login_panle">
+      <div class="login_panle_form">
+        <div class="login_panle_form_title">
+          <!-- <img
+            class="login_panle_form_title_logo"
+            :src="$GIN_VUE_ADMIN.appLogo"
+            alt
+          /> -->
+          <p class="login_panle_form_title_p">绩效考核用户端登录</p>
+        </div>
+        <el-form
+          ref="loginForm"
+          :model="loginForm"
+          :rules="rules"
+          @keyup.enter="submitForm"
+        >
+          <el-form-item prop="username">
+            <el-input v-model="loginForm.username" placeholder="请输入工号">
+              <template #suffix>
+                <i class="el-input__icon el-icon-user" />
+              </template>
+            </el-input>
+          </el-form-item>
+          <el-form-item prop="password">
+            <el-input
+              v-model="loginForm.password"
+              :type="lock === 'lock' ? 'password' : 'text'"
+              placeholder="请输入密码"
+            >
+              <template #suffix>
+                <i
+                  :class="'el-input__icon el-icon-' + lock"
+                  @click="changeLock"
+                />
+              </template>
+            </el-input>
+          </el-form-item>
+          <el-form-item style="position: relative" prop="captcha">
+            <el-input
+              v-model="loginForm.captcha"
+              name="logVerify"
+              placeholder="请输入验证码"
+              style="width: 60%"
+            />
+            <div class="vPic">
+              <img
+                v-if="picPath"
+                :src="picPath"
+                alt="请输入验证码"
+                @click="loginVerify()"
+              />
+            </div>
+          </el-form-item>
+          <el-form-item>
+            <!-- <el-button type="primary" style="width: 46%" @click="checkInit"
+              >前往初始化</el-button
+            > -->
+            <el-button
+              type="primary"
+              style="width: 46%; margin-left: 25%"
+              @click="submitForm"
+              >登 录</el-button
+            >
+          </el-form-item>
+        </el-form>
+      </div>
+      <div class="login_panle_right" />
+    </div>
+  </div>
+</template>
+<script>
+import { mapActions } from 'vuex'
+import { captcha } from '@/api/user'
+import { checkDB } from '@/api/initdb'
+export default {
+  name: 'Login',
+  data() {
+    const checkUsername = (rule, value, callback) => {
+      if (value.length < 5) {
+        return callback(new Error('请输入正确的用户名'))
+      } else {
+        callback()
+      }
+    }
+    const checkPassword = (rule, value, callback) => {
+      if (value.length < 6) {
+        return callback(new Error('请输入正确的密码'))
+      } else {
+        callback()
+      }
+    }
+    return {
+      curYear: 0,
+      lock: 'lock',
+      loginForm: {
+        username: 'admin',
+        password: '123456',
+        captcha: '',
+        captchaId: ''
+      },
+      rules: {
+        username: [{ validator: checkUsername, trigger: 'blur' }],
+        password: [{ validator: checkPassword, trigger: 'blur' }],
+        captcha: [{ required: true, message: '请输入验证码', trigger: 'blur' },
+          {
+            min: 5,
+            max: 6,
+            message: '验证码格式不正确',
+            trigger: 'blur',
+          }]
+      },
+      logVerify: '',
+      picPath: ''
+    }
+  },
+  created() {
+    this.loginVerify()
+    this.curYear = new Date().getFullYear()
+  },
+  methods: {
+    ...mapActions('user', ['LoginIn']),
+    async checkInit() {
+      const res = await checkDB()
+      if (res.code === 0) {
+        if (res.data?.needInit) {
+          this.$store.commit('user/NeedInit')
+          this.$router.push({ name: 'Init' })
+        } else {
+          this.$message({
+            type: 'info',
+            message: '已配置数据库信息，无法初始化'
+          })
+        }
+      }
+    },
+    async login() {
+      return await this.LoginIn(this.loginForm)
+    },
+    async submitForm() {
+      this.$refs.loginForm.validate(async(v) => {
+        if (v) {
+          const flag = await this.login()
+          if (!flag) {
+            this.loginVerify()
+          }
+        } else {
+          this.$message({
+            type: 'error',
+            message: '请正确填写登录信息',
+            showClose: true
+          })
+          this.loginVerify()
+          return false
+        }
+      })
+    },
+    changeLock() {
+      this.lock = this.lock === 'lock' ? 'unlock' : 'lock'
+    },
+    loginVerify() {
+      captcha({}).then((ele) => {
+        this.picPath = ele.data.picPath
+        this.loginForm.captchaId = ele.data.captchaId
+      })
+    }
+  }
+}
+
+</script>
+
+
+
+
+<style lang="scss" scoped>
+@import "@/style/newLogin.scss";
+</style>

web/src/view/news/column/topColumn.vue

@@ -11,7 +11,7 @@
             <el-table-column label="状态" prop="state" center>
                 <template #default="scope"> 
                     <div>
-                        <el-switch style="display: block" v-model="scope.row.state" active-color="#13ce66" inactive-color="#ff4949" active-text="启用" inactive-text="禁用"></el-switch>
+                        <el-switch style="display: block" v-model="scope.row.state" active-color="#13ce66" inactive-color="#ff4949" active-text="启用" inactive-text="禁用" @change="changeVal($event,scope.row.outID)"></el-switch>
                         <!-- <el-switch :active-value="1" :inactive-value="2" v-model="scope.row.state" disabled /> -->
                     </div>
                 </template>
@@ -26,12 +26,13 @@
     </div>
     <!-- 新增弹窗 -->
     <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" title="新增顶级栏目" width="20%">
-      <el-form ref="addForm" :model="addform" :rules="rules" label-width="80px">
-        <el-form-item label="栏目名称" prop="user_name">
-          <el-input v-model="addform.user_name" />
+      <el-form ref="addForm" :model="addform" :rules="addRules" label-width="80px">
+        <el-form-item label="栏目名称" prop="title">
+          <el-input v-model="addform.title" />
         </el-form-item>
-        <el-form-item label="序号" prop="user_wechat">
-          <el-input v-model="addform.user_wechat" />
+        <el-form-item label="序号" prop="sort">
+          <!-- <el-input-number v-model="addform.sort" controls-position="right" @change="handleChange" :min="1"></el-input-number> -->
+          <el-input v-model="addform.sort" type="number"/>
         </el-form-item>
       </el-form>
       <template #footer>
@@ -44,11 +45,11 @@
     <!-- 修改弹窗 -->
     <el-dialog v-model="editDialogFormVisible" :before-close="closeEditDialog" title="修改顶级栏目" width="20%">
       <el-form ref="editForm" :model="editForm" :rules="editRules" label-width="80px">
-        <el-form-item label="栏目名称" prop="user_name">
-          <el-input v-model="editForm.user_name" />
+        <el-form-item label="栏目名称" prop="title">
+          <el-input @input='change()' v-model="editForm.title" />
         </el-form-item>
-        <el-form-item label="序号" prop="user_wechat">
-          <el-input v-model="editForm.user_wechat" />
+        <el-form-item label="序号" prop="sort">
+          <el-input @input='change()' v-model="editForm.sort" />
         </el-form-item>
       </el-form>
       <template #footer>
@@ -64,80 +65,102 @@
 <script>
 // 获取列表内容封装在mixins内部  getTableData方法 初始化已封装完成 条件搜索时候 请把条件安好后台定制的结构体字段 放到 this.searchInfo 中即可实现条件搜索
 
-// import {
-//   noticeuserlist,
-//   looknoticeusercont,
-//   delnoticeuser,
-//   eitenoticeuser,
-//   addnoticeuser
-// } from '@/api/healthy'
+import {
+  archivetypelist,
+  addarchivetype,
+  eitearchivestate,
+  getarchiveinfo,
+  eitearchiveinfo
+} from '@/api/documentation'
+import infoList from '@/mixins/infoList'
 
 export default {
-  name: 'Notify',
+  name: 'Api',
   
+  mixins: [infoList],
   data() {
     return {
-      tableData:[
-          {
-            // 栏目id
-            id:1,
-            //   栏目名称
-              columnr_name:'恒信动态',
-            //   排序
-              sort:'1',
-            //   状态
-              state:true
-          },
-          {
-              // 栏目id
-            id:2,
-            //   栏目名称
-              columnr_name:'知识库',
-            //   排序
-              sort:'2',
-            //   状态
-              state:true
-          },
-          {
-              // 栏目id
-            id:3,
-            //   栏目名称
-              columnr_name:'恒信课堂',
-            //   排序
-              sort:'3',
-            //   状态
-              state:true
-          },
-      ],
+      deleFrom:{
+        outID:'',
+        state:Number
+      },
       editDialogFormVisible:false,
+      groupList:"",
       deleteVisible: false,
+      listApi: archivetypelist,
       dialogFormVisible: false,
-      dialogTitle: '新增通知人',
       apis: [],
-      addform: {
-        user_name:'',
-        user_wechat:''
+      switchFrom:{
+        outID:'',
+        state:Number
       },
-      editForm: {
-        user_name:'',
-        user_wechat:''
+      editForm:{
+         title:'',
+         sort:50
+      },
+      addform: {
+        title:'',
+        parentId:0,
+        uid:15961633186948456,
+        sort:50
       },
       type: '',
-      rules: {
-        user_name: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
-        user_wechat: [{ required: true, message: '请输入微信UID', trigger: 'blur' }],
+      addRules: {
+        title: [{ required: true, message: '请输入栏目名称', trigger: 'blur' }],
+      },
+      editOperateFrom:{
+        id:10000000,
+        outID:'',
       },
-      editRules: {
-        user_name: [{ required: true, message: '请输入姓名', trigger: 'blur' }],
-        user_wechat: [{ required: true, message: '请输入微信UID', trigger: 'blur' }],
-      }
     }
   },
   created() {
-    this.getNoticeuserList()
+    this.getTableData()
   },
   methods: {
-    //   删除操作
+    // change(){
+    //   console.log("111")
+    //    this.$forceUpdate()  //强制刷新
+    // },
+    // 修改form清空
+    editInitForm() {
+      this.$refs.editForm.resetFields()
+      this.editForm = {
+        user_name:'',
+        user_wechat:''
+      }
+    },
+     // 关闭修改弹框事件
+    closeEditDialog() {
+      this.editInitForm()
+      this.editDialogFormVisible = false
+    },
+     //   修改操作
+    edit(){
+        this.$refs.editForm.validate(async valid => {
+        if (valid) {
+          const res = await eitearchiveinfo(this.editForm)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '添加成功',
+                    showClose: true
+                  })
+                }
+                this.getNoticeuserList()
+                this.closeEditDialog()
+        }
+      })
+    },
+    // 点击修改事件
+    async editOperate(row) {
+      this.editOperateFrom.outID=row.outID;
+      const res = await getarchiveinfo(this.editOperateFrom)
+      this.editForm = res.data
+      console.log(res.data)
+      this.editDialogFormVisible=true
+    },
+     //删除操作
     async deleteOperate(row) {
       this.$confirm('此操作将永久删除, 是否继续?', '提示', {
         confirmButtonText: '确定',
@@ -145,39 +168,53 @@ export default {
         type: 'warning'
       })
         .then(async() => {
-          const res = await delnoticeuser({ id: row.id })
+          this.deleFrom.state=3;
+          console.log(row.outID)
+          this.deleFrom.outID=row.outID;
+          console.log(this.deleFrom.id)
+          const res = await eitearchivestate(this.deleFrom)
           if (res.code === 0) {
+            
             this.$message({
               type: 'success',
               message: '删除成功!'
             })
             
-            this.getNoticeuserList()
+             this.getTableData()
           }
         })
     },
-     //   修改操作
-    edit(){
-        this.$refs.editForm.validate(async valid => {
-        if (valid) {
-          const res = await eitenoticeuser(this.editForm)
+    // 开关状态监听
+   async changeVal(val,id){
+      this.switchFrom.outID=id
+      if (val==true) {
+        this.switchFrom.state=1;
+        const res = await eitearchivestate(this.switchFrom)
                 if (res.code === 0) {
                   this.$message({
                     type: 'success',
-                    message: '添加成功',
+                    message: '修改状态成功',
                     showClose: true
                   })
                 }
-                this.getNoticeuserList()
-                this.closeEditDialog()
-        }
-      })
+      } else {
+        this.switchFrom.state=2;
+        const res = await eitearchivestate(this.switchFrom)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '修改状态成功',
+                    showClose: true
+                  })
+                }
+      }
     },
     //   新增操作
     add(){
         this.$refs.addForm.validate(async valid => {
         if (valid) {
-          const res = await addnoticeuser(this.addform)
+          this.addform.sort=parseInt(this.addform.sort)
+          const res = await addarchivetype(this.addform)
                 if (res.code === 0) {
                   this.$message({
                     type: 'success',
@@ -185,71 +222,66 @@ export default {
                     showClose: true
                   })
                 }
-                this.getNoticeuserList()
+                this.getTableData()
                 this.closeDialog()
         }
       })
     },
-    // 新增/编辑
-    openDialog(type) {
-      switch (type) {
-        case 'add':
-          this.dialogTitle = '新增通知人'
-          break
-        case 'edit':
-          this.dialogTitle = '编辑通知人'
-          break
-        default:
-          break
-      }
-      this.type = type
-      this.dialogFormVisible = true
+    //  新增
+    openDialog(){
+      this.dialogFormVisible=true;
+
     },
     
-    // 获取通知人列表
-    async getNoticeuserList(){
-      const res=await noticeuserlist()
-      if(res.code==0){
-        this.tableData=res.data
-      }
+    // getseportstatisticsList(){
+    //   const res = await getseportstatistics()
+    //   if (res.code==0) {
+    //   } else {
+        
+    //   }
+    // },
+    //  选中api
+    handleSelectionChange(val) {
+      this.apis = val
     },
-    // 点击修改事件
-    async editOperate(row) {
-      const res = await looknoticeusercont({ id: row.id })
-      this.editForm = res.data
-      this.editDialogFormVisible=true
+    async onDelete() {
+      const ids = this.apis.forEach(item => item.ID)
+      const res = await deleteApisByIds({ ids })
+      if (res.code === 0) {
+        this.$message({
+          type: 'success',
+          message: res.msg
+        })
+        if (this.tableData.length === ids.length && this.page > 1) {
+          this.page--
+        }
+        this.deleteVisible = false
+        this.getTableData()
+      }
     },
    
     onReset() {
       this.searchInfo = {}
     },
-    
-    // 新增form清空
+    // 条件搜索前端看此方法
+    onSubmit() {
+      this.page = 1
+      this.pageSize = 10
+      this.getTableData()
+    },
     initForm() {
       this.$refs.addForm.resetFields()
-      this.addform = {
-        user_name:'',
-        user_wechat:''
+      this.addForm = {
+        title:'',
+        parentId:0,
+        uid:15961633186948456,
+        sort:''
       }
     },
-    // 修改form清空
-    editInitForm() {
-      this.$refs.editForm.resetFields()
-      this.editForm = {
-        user_name:'',
-        user_wechat:''
-      }
-    },
-    // 关闭添加弹框事件
     closeDialog() {
       this.initForm()
       this.dialogFormVisible = false
     },
-    // 关闭修改弹框事件
-    closeEditDialog() {
-      this.editInitForm()
-      this.editDialogFormVisible = false
-    },
     
   }
 }

web/src/view/news/information/comment.vue

@@ -87,12 +87,8 @@
 
 <script>
 import {
-  createExaCustomer,
-  updateExaCustomer,
-  deleteExaCustomer,
-  getExaCustomer,
-  getExaCustomerList
-} from '@/api/customer'
+  getdiscussfilemsg
+} from '@/api/comment'
 import infoList from '@/mixins/infoList'
 import warningBar from '@/components/warningBar/warningBar.vue'
 
@@ -140,7 +136,7 @@ export default {
 
         },
       ],
-      listApi: getExaCustomerList,
+      listApi: getdiscussfilemsg,
       dialogFormVisible: false,
       type: '',
       form: {

web/src/view/news/information/dynamicManagement.vue

@@ -4,10 +4,20 @@
       <div class="gva-search-box">
       <el-form ref="searchForm" :inline="true" :model="searchInfo">
         <el-form-item label="文章标题">
-          <el-input v-model="searchInfo.title" placeholder="文章标题" />
+          <el-input v-model="queryParams.title" placeholder="文章标题" />
+        </el-form-item>
+         <el-form-item label="所属栏目">
+          <el-select v-model="queryParams.parentIdStr" clearable placeholder="请选择">
+            <el-option
+              v-for="item in archivetypeList"
+              :key="item.outID"
+              :label="item.columnr_name"
+              :value="item.outID">
+            </el-option>
+          </el-select>
         </el-form-item>
         <el-form-item label="所属栏目">
-          <el-input v-model="searchInfo.column" placeholder="所属栏目" />
+          <el-input v-model="queryParams.column" placeholder="所属栏目" />
         </el-form-item>
         <el-form-item>
           <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
@@ -19,9 +29,10 @@
         <div class="gva-btn-list">
             <el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog('add')">新增</el-button>
         </div>
-        <el-table :data="tableData">
+        <el-table :data="tableData" border>
             <el-table-column label="文章标题" prop="title" />
-            <el-table-column label="所属栏目" prop="column" />
+            <el-table-column label="所属栏目" prop="parentColumnTitle" />
+            <el-table-column label="所属子栏目" prop="columnTitle" />
             <el-table-column label="可见范围" prop="scope" />
             <el-table-column label="访问数据" prop="data" center>
                 <template #default="scope"> 
@@ -38,7 +49,7 @@
             <el-table-column label="状态" prop="state" center>
                 <template #default="scope"> 
                     <div>
-                        <el-switch disabled style="display: block" v-model="scope.row.state" active-color="#13ce66" inactive-color="#ff4949" active-text="启用" inactive-text="禁用"></el-switch>
+                        <el-switch style="display: block" v-model="scope.row.state" active-color="#13ce66" inactive-color="#ff4949" active-text="启用" inactive-text="禁用"></el-switch>
                     </div>
                 </template>
             </el-table-column>
@@ -49,7 +60,18 @@
                 </template>
             </el-table-column>
         </el-table>
+        <!-- 分页器 -->
+        <el-pagination
+          @size-change="handleSizeChange"
+          @current-change="handleCurrentChange"
+          :current-page="currentPage4"
+          :page-sizes="[10, 20, 30, 40]"
+          :page-size="queryParams.pagesize"
+          layout="total, sizes, prev, pager, next, jumper"
+          :total="total">
+        </el-pagination>
     </div>
+    
     <!-- 新增弹窗 -->
     <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" :title="dialogTitle">
       <el-form ref="form" :model="form" :rules="rules" label-width="80px">
@@ -198,15 +220,13 @@
 
 <script>
 // 获取列表内容封装在mixins内部  getTableData方法 初始化已封装完成 条件搜索时候 请把条件安好后台定制的结构体字段 放到 this.searchInfo 中即可实现条件搜索
-
-// import {
-//   noticeuserlist,
-//   looknoticeusercont,
-//   delnoticeuser,
-//   eitenoticeuser,
-//   addnoticeuser
-// } from '@/api/healthy'
-import infoList from '@/mixins/infoList'
+import {
+  archivetypelist
+} from '@/api/documentation'
+import {
+  archivefilelist
+} from '@/api/comment'
+// import infoList from '@/mixins/infoList'
 // import EditorBar from '../../../components/wangEnduit/index.vue'
 // 富文本组件
 // import Editor from "@/components/Editor/index.vue"
@@ -216,9 +236,17 @@ export default {
     tinymce
   },
   name: 'Notify',
-  mixins: [infoList],
+  // mixins: [infoList],
   data() {
     return {
+      // 查询参数
+      queryParams: {
+        page: 1,
+        pagesize: 10,
+        parentId:null,
+        parentIdStr:''
+      },
+      // listApi: archivefilelist,
       originalUrlShow:false,
       detailsData:[
         {
@@ -243,56 +271,59 @@ export default {
         },
       ],
       detailsTittle:'',
-      tableData:[
-          {
-            // id
-            id:1,
-            //文章标题
-              title:'2021年11月二级库检查通报',
-            //所属栏目
-              column:'检查通报',
-            //可见范围
-              scope:'公开',
-              //阅读量
-              reading:22,
-              //评论数
-              comment:66,
-              //收藏数
-              collect:11,
-              //点赞数
-              like:33,
-              //踩
-              tread:44,
-              //综合评分
-              score:55,
-              //状态
-              state:true
-          },
-          {
-            // id
-            id:1,
-            //文章标题
-              title:'机焦车间简报',
-            //所属栏目
-              column:'新闻动态',
-            //可见范围
-              scope:'自定义',
-              //阅读量
-              reading:22,
-              //评论数
-              comment:66,
-              //收藏数
-              collect:11,
-              //点赞数
-              like:33,
-              //踩
-              tread:44,
-              //综合评分
-              score:55,
-              //状态
-              state:true
-          },
-      ],
+      tableData:[],
+      // tableData:[
+      //     {
+      //       // id
+      //       id:1,
+      //       //文章标题
+      //         title:'2021年11月二级库检查通报',
+      //       //所属栏目
+      //         column:'检查通报',
+      //       //可见范围
+      //         scope:'公开',
+      //         //阅读量
+      //         reading:22,
+      //         //评论数
+      //         comment:66,
+      //         //收藏数
+      //         collect:11,
+      //         //点赞数
+      //         like:33,
+      //         //踩
+      //         tread:44,
+      //         //综合评分
+      //         score:55,
+      //         //状态
+      //         state:true
+      //     },
+      //     {
+      //       // id
+      //       id:1,
+      //       //文章标题
+      //         title:'机焦车间简报',
+      //       //所属栏目
+      //         column:'新闻动态',
+      //       //可见范围
+      //         scope:'自定义',
+      //         //阅读量
+      //         reading:22,
+      //         //评论数
+      //         comment:66,
+      //         //收藏数
+      //         collect:11,
+      //         //点赞数
+      //         like:33,
+      //         //踩
+      //         tread:44,
+      //         //综合评分
+      //         score:55,
+      //         //状态
+      //         state:true
+      //     },
+      // ],
+      // 栏目List
+      archivetypeList:[],
       fileList1:[],
       fileList:[],
       detailsDialogFormVisible:false,
@@ -318,9 +349,55 @@ export default {
     }
   },
   created() {
-    // this.getNoticeuserList()
+    // this.getTableData();
+    this.getArchivefilelist()
+    this.getArchivetypelist()
   },
+  watch: {
+      queryParams(newVal, oldVal) {
+        this.newVal = newVal
+        console.log("inputVal = " + newVal + " , oldValue = " + oldVal)
+      }
+    },
   methods: {
+    // 获取栏目List
+    async getArchivetypelist(){
+      const res = await archivetypelist(this.queryParams)
+     this.archivetypeList =res.data.list
+    },
+    // pagesize变化
+    handleSizeChange(val) {
+      this.queryParams.pagesize=val
+      this.getArchivefilelist()
+      },
+      // page变化
+      handleCurrentChange(val) {
+        this.queryParams.page=val
+        this.getArchivefilelist()
+      },
+      // 获取文章List
+    async getArchivefilelist(){
+      if(this.queryParams.parentId==null){
+        this.queryParams.parentId=0
+      }
+      const res = await archivefilelist(this.queryParams)
+      this.tableData = res.data.list
+      this.total=res.data.total
+      this.queryParams.pagesize=res.data.pageSize,
+      this.queryParams.page=res.data.page,
+      this.queryParams.parentId=null
+      console.log(this.queryParams.parentId)
+      console.log(res.data)
+    },
+    onReset() {
+      this.searchInfo = {}
+    },
+    // 条件搜索前端看此方法
+    onSubmit() {
+      this.page = 1
+      this.pageSize = 10
+      this.getArchivefilelist()
+    },
     // 文档来源数据监听
     changeSource(val){
       if(val==2){
@@ -472,9 +549,7 @@ export default {
       this.dialogFormVisible=true
     },
    
-    onReset() {
-      this.searchInfo = {}
-    },
+    
     
     // 新增form清空
     initForm() {

web/src/view/performance/assessment/index.vue

@@ -0,0 +1,385 @@
+<template>
+<!-- 履职尽责考核表录入 -->
+  <div>
+    <div class="gva-search-box">
+      <el-form ref="searchForm" :inline="true" :model="searchInfo">
+        <el-form-item label="所属部门">
+          <el-select v-model="searchInfo.workSection" clearable placeholder="请选择部门">
+            <el-option value="1" label="a工段">煤焦分厂</el-option>
+            <el-option value="2" label="b工段">化产分厂</el-option>
+            <el-option value="2" label="b工段">甲醇分厂</el-option>
+            <el-option value="2" label="b工段">动力分厂</el-option>
+            <el-option value="2" label="b工段">生产部</el-option>
+            <el-option value="2" label="b工段">技术部</el-option>
+            <el-option value="2" label="b工段">质检中心</el-option>
+            <el-option value="2" label="b工段">安全部</el-option>
+            <el-option value="2" label="b工段">环保部</el-option>
+            <el-option value="2" label="b工段">营销部</el-option>
+            <el-option value="2" label="b工段">仓储中心</el-option>
+            <el-option value="2" label="b工段">物流中心</el-option>
+            <el-option value="2" label="b工段">人力资源部</el-option>
+            <el-option value="2" label="b工段">财务部</el-option>
+            <el-option value="2" label="b工段">综合办</el-option>
+            <el-option value="2" label="b工段">企管部</el-option>
+            <el-option value="2" label="b工段">保卫部</el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
+          <el-button size="mini" icon="el-icon-refresh" @click="onReset">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="gva-table-box">
+      <div class="gva-btn-list">
+        <el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog('addApi')">新增</el-button>
+        <el-button size="mini" type="primary" icon="el-icon-upload" @click="openDialog('addApi')">导入题库数据</el-button>
+        <el-popover v-model:visible="deleteVisible" placement="top" width="160">
+          <p>确定要删除吗？</p>
+          <div style="text-align: right; margin-top: 8px;">
+            <el-button size="mini" type="text" @click="deleteVisible = false">取消</el-button>
+            <el-button size="mini" type="primary" @click="onDelete">确定</el-button>
+          </div>
+          <template #reference>
+            <el-button icon="el-icon-delete" size="mini" :disabled="!apis.length" style="margin-left: 10px;">删除</el-button>
+          </template>
+        </el-popover>
+      </div>
+      <el-table :data="tableData" @sort-change="sortChange" @selection-change="handleSelectionChange">
+        <el-table-column
+          type="selection"
+          width="55"
+        />
+        <el-table-column align="left" label="部门" min-width="150" prop="description"/>
+        <el-table-column align="left" label="考核类别" min-width="60" prop="ID"/>
+        <el-table-column align="left" label="权重（%）" min-width="150" prop="path"/>
+        <el-table-column align="left" label="考核项目" min-width="150" prop="apiGroup"/>
+        <el-table-column align="left" label="考核说明" min-width="150" prop="apiGroup"/>
+        <!-- <el-table-column align="left" label="创建时间" min-width="150" prop="method">
+          <template #default="scope">
+            <div>
+              {{ scope.row.method }} / {{ methodFiletr(scope.row.method) }}
+            </div>
+          </template>
+        </el-table-column> -->
+        
+        <el-table-column align="left" fixed="right" label="操作" width="200">
+          <template #default="scope">
+            <el-button
+              icon="el-icon-edit"
+              size="small"
+              type="text"
+              @click="editApi(scope.row)"
+            >编辑</el-button>
+            <el-button
+              icon="el-icon-delete"
+              size="small"
+              type="text"
+              @click="deleteApi(scope.row)"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="gva-pagination">
+        <el-pagination
+          :current-page="page"
+          :page-size="pageSize"
+          :page-sizes="[10, 30, 50, 100]"
+          :total="total"
+          layout="total, sizes, prev, pager, next, jumper"
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+        />
+      </div>
+
+    </div>
+
+    <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" :title="dialogTitle" width="20%">
+      
+      <el-form ref="apiForm" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="考核类别" prop="category">
+          <el-input v-model="form.category" autocomplete="off" />
+        </el-form-item>
+        <el-form-item label="部门" prop="department">
+          <el-select v-model="form.department" placeholder="请选择部门" style="width:100%">
+            <el-option value="1" label="a工段">煤焦分厂</el-option>
+            <el-option value="2" label="b工段">化产分厂</el-option>
+            <el-option value="2" label="b工段">甲醇分厂</el-option>
+            <el-option value="2" label="b工段">动力分厂</el-option>
+            <el-option value="2" label="b工段">生产部</el-option>
+            <el-option value="2" label="b工段">技术部</el-option>
+            <el-option value="2" label="b工段">质检中心</el-option>
+            <el-option value="2" label="b工段">安全部</el-option>
+            <el-option value="2" label="b工段">环保部</el-option>
+            <el-option value="2" label="b工段">营销部</el-option>
+            <el-option value="2" label="b工段">仓储中心</el-option>
+            <el-option value="2" label="b工段">物流中心</el-option>
+            <el-option value="2" label="b工段">人力资源部</el-option>
+            <el-option value="2" label="b工段">财务部</el-option>
+            <el-option value="2" label="b工段">综合办</el-option>
+            <el-option value="2" label="b工段">企管部</el-option>
+            <el-option value="2" label="b工段">保卫部</el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="考核项目" prop="apiGrprojectoup">
+          <el-input v-model="form.project" autocomplete="off" />
+        </el-form-item>
+        <el-form-item label="权重" prop="weights">
+         <el-input placeholder="请输入内容" v-model="form.weights">
+            <template #append>%</template>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="考核说明" prop="instruction">
+          <el-input
+            v-model="form.instruction"
+            :rows="2"
+            type="textarea"
+            placeholder="请输入考核说明"
+          />
+          <!-- <el-input v-model="form.instruction" autocomplete="off" /> -->
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button size="small" @click="closeDialog">取 消</el-button>
+          <el-button size="small" type="primary" @click="enterDialog">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+// 获取列表内容封装在mixins内部  getTableData方法 初始化已封装完成 条件搜索时候 请把条件安好后台定制的结构体字段 放到 this.searchInfo 中即可实现条件搜索
+
+import {
+  getApiById,
+  getApiList,
+  createApi,
+  updateApi,
+  deleteApi,
+  deleteApisByIds
+} from '@/api/api'
+import infoList from '@/mixins/infoList'
+import { toSQLLine } from '@/utils/stringFun'
+import warningBar from '@/components/warningBar/warningBar.vue'
+const methodOptions = [
+  {
+    value: 'POST',
+    label: '创建',
+    type: 'success'
+  },
+  {
+    value: 'GET',
+    label: '查看',
+    type: ''
+  },
+  {
+    value: 'PUT',
+    label: '更新',
+    type: 'warning'
+  },
+  {
+    value: 'DELETE',
+    label: '删除',
+    type: 'danger'
+  }
+]
+
+export default {
+  name: 'Api',
+  components: {
+    warningBar
+  },
+  mixins: [infoList],
+  data() {
+    return {
+      deleteVisible: false,
+      listApi: getApiList,
+      dialogFormVisible: false,
+      dialogTitle: '新增',
+      apis: [],
+      form: {
+        path: '',
+        apiGroup: '',
+        method: '',
+        description: ''
+      },
+      methodOptions: methodOptions,
+      type: '',
+      rules: {
+        path: [{ required: true, message: '请输入api路径', trigger: 'blur' }],
+        apiGroup: [
+          { required: true, message: '请输入组名称', trigger: 'blur' }
+        ],
+        method: [
+          { required: true, message: '请选择请求方式', trigger: 'blur' }
+        ],
+        description: [
+          { required: true, message: '请输入api介绍', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  created() {
+    this.getTableData()
+  },
+  methods: {
+    methodFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.label}`
+    },
+    tagTypeFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.type}`
+    },
+    //  选中api
+    handleSelectionChange(val) {
+      this.apis = val
+    },
+    async onDelete() {
+      const ids = this.apis.forEach(item => item.ID)
+      const res = await deleteApisByIds({ ids })
+      if (res.code === 0) {
+        this.$message({
+          type: 'success',
+          message: res.msg
+        })
+        if (this.tableData.length === ids.length && this.page > 1) {
+          this.page--
+        }
+        this.deleteVisible = false
+        this.getTableData()
+      }
+    },
+    // 排序
+    sortChange({ prop, order }) {
+      if (prop) {
+        this.searchInfo.orderKey = toSQLLine(prop)
+        this.searchInfo.desc = order === 'descending'
+      }
+      this.getTableData()
+    },
+    onReset() {
+      this.searchInfo = {}
+    },
+    // 条件搜索前端看此方法
+    onSubmit() {
+      this.page = 1
+      this.pageSize = 10
+      this.getTableData()
+    },
+    initForm() {
+      this.$refs.apiForm.resetFields()
+      this.form = {
+        path: '',
+        apiGroup: '',
+        method: '',
+        description: ''
+      }
+    },
+    closeDialog() {
+      this.initForm()
+      this.dialogFormVisible = false
+    },
+    openDialog(type) {
+      switch (type) {
+        case 'addApi':
+          this.dialogTitle = '新增'
+          break
+        case 'edit':
+          this.dialogTitle = '编辑'
+          break
+        default:
+          break
+      }
+      this.type = type
+      this.dialogFormVisible = true
+    },
+    async editApi(row) {
+      const res = await getApiById({ id: row.ID })
+      this.form = res.data.api
+      this.openDialog('edit')
+    },
+    async deleteApi(row) {
+      this.$confirm('此操作将永久删除所有角色下该api, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(async() => {
+          const res = await deleteApi(row)
+          if (res.code === 0) {
+            this.$message({
+              type: 'success',
+              message: '删除成功!'
+            })
+            if (this.tableData.length === 1 && this.page > 1) {
+              this.page--
+            }
+            this.getTableData()
+          }
+        })
+    },
+    async enterDialog() {
+      this.$refs.apiForm.validate(async valid => {
+        if (valid) {
+          switch (this.type) {
+            case 'addApi':
+              {
+                const res = await createApi(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '添加成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+
+              break
+            case 'edit':
+              {
+                const res = await updateApi(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '编辑成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+              break
+            default:
+              // eslint-disable-next-line no-lone-blocks
+              {
+                this.$message({
+                  type: 'error',
+                  message: '未知操作',
+                  showClose: true
+                })
+              }
+              break
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.button-box {
+  padding: 10px 20px;
+  .el-button {
+    float: right;
+  }
+}
+.warning {
+  color: #dc143c;
+}
+</style>

web/src/view/performance/dataEntry/beAssessed copy.vue

@@ -0,0 +1,443 @@
+<template>
+<!-- 被考核部门录入 -->
+  <div>
+    <div class="gva-search-box">
+      <el-form ref="searchForm" :inline="true" :model="searchInfo">
+        <el-form-item label="考核类别名称">
+          <el-input
+            placeholder="请输入名称"
+            v-model="searchInfo.title"
+            clearable>
+          </el-input>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="gva-table-box">
+      <div class="gva-btn-list">
+        <el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog('addApi')">新增</el-button>
+      </div>
+      <el-table :data="tableData" @sort-change="sortChange" @selection-change="handleSelectionChange">
+        <!-- <el-table-column
+          type="selection"
+          width="55"
+        /> -->
+        <el-table-column align="left" label="考核类别" prop="classTitle"/>
+        <el-table-column align="left" label="考核项目" prop="assessTitle"/>
+        <el-table-column align="left" label="具体职责" prop="duryTitle"/>
+        <el-table-column align="left" label="部门名称" prop="parentTitle">
+            <template #default="scope">
+                {{scope.row.groupTitle}}{{scope.row.parentTitle}}
+             </template>
+        </el-table-column>
+        <el-table-column align="left" label="状态">
+            <template #default="scope">
+                <el-switch
+                    inline-prompt 
+                    active-text="正常" 
+                    inactive-text="禁止"
+                    v-model="scope.row.state"
+                    active-color="#13ce66"
+                    inactive-color="#ff4949"
+                    :active-value=1
+                    :inactive-value=2
+                    @change="changeVal($event,scope.row.outId)"
+                    />
+             </template>
+        </el-table-column>
+        <el-table-column align="left" fixed="right" label="操作" width="200">
+          <template #default="scope">
+            <el-button
+              icon="el-icon-edit"
+              size="small"
+              type="text"
+              @click="editApi(scope.row)"
+            >编辑</el-button>
+            <el-button
+              icon="el-icon-delete"
+              size="small"
+              type="text"
+              @click="deleteOperate(scope.row)"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="gva-pagination">
+        <el-pagination
+          :current-page="page"
+          :page-size="pageSize"
+          :page-sizes="[10, 30, 50, 100]"
+          :total="total"
+          layout="total, sizes, prev, pager, next, jumper"
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+        />
+      </div>
+
+    </div>
+
+    <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" :title="dialogTitle" width="20%">
+      
+      <el-form ref="apiForm" :model="form" :rules="rules" label-width="150px">
+        <el-form-item label="考核类别" prop="title">
+          <el-select @change="getClassId" v-model="form.classId" clearable placeholder="请选择考核类别">
+             <el-option
+              v-for="item in dutyclasslist"
+              :key="item.outId"
+              :label="item.title"
+              :value="item.outId"
+              
+              >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item v-if="showAssess" label="考核项目" prop="title">
+          <el-select v-model="form.assessId" clearable placeholder="请选择考核项目" @change="getAssessId">
+             <el-option
+              v-for="item in assessList"
+              :key="item.outId"
+              :label="item.title"
+              :value="item.outId"
+              >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item v-if="showDuty" label="具体职责" prop="title">
+          <el-select v-model="form.dutyId" clearable placeholder="请选择具体职责">
+             <el-option
+              v-for="item in dutylist"
+              :key="item.outId"
+              :label="item.title"
+              :value="item.outId"
+              >
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="分值" prop="title">
+          <el-input v-model="form.title" autocomplete="off" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button size="small" @click="closeDialog">取 消</el-button>
+          <el-button size="small" type="primary" @click="enterDialog">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+// 获取列表内容封装在mixins内部  getTableData方法 初始化已封装完成 条件搜索时候 请把条件安好后台定制的结构体字段 放到 this.searchInfo 中即可实现条件搜索
+
+import {
+  specdutylist,
+  addspecdutyinfo,
+  getspecdutyinfo,
+  eitespecdutyinfo,
+  dutyclasslist,
+  assessList,
+  dutylist,
+  eitespecdutystate
+} from '@/api/dataEntry'
+import infoList from '@/mixins/infoList'
+import { toSQLLine } from '@/utils/stringFun'
+import warningBar from '@/components/warningBar/warningBar.vue'
+const methodOptions = [
+  {
+    value: 'POST',
+    label: '创建',
+    type: 'success'
+  },
+  {
+    value: 'GET',
+    label: '查看',
+    type: ''
+  },
+  {
+    value: 'PUT',
+    label: '更新',
+    type: 'warning'
+  },
+  {
+    value: 'DELETE',
+    label: '删除',
+    type: 'danger'
+  }
+]
+
+export default {
+  name: 'Api',
+  components: {
+    warningBar
+  },
+  mixins: [infoList],
+  data() {
+    return {
+        showDuty:false,
+        assessList:{},
+        dutylist:{},
+        showAssess:false,
+        searchList:{
+        page:1,
+        pagesize:10000,
+        state:1,
+      },
+        deleFrom:{
+        outid:'',
+        state:Number
+      },
+        switchFrom:{
+        outid:'',
+        state:Number
+      },
+      editFrom:{
+          outid:'',
+      },
+      deleteVisible: false,
+      listApi: specdutylist,
+      dialogFormVisible: false,
+      dialogTitle: '新增',
+      apis: [],
+      form: {
+        title:'',
+      },
+      methodOptions: methodOptions,
+      type: '',
+      rules: {
+        title: [{ required: true, message: '考核类别名称', trigger: 'blur' }],
+       
+      }
+    }
+  },
+  created() {
+    this.getTableData()
+    this.getDutyclasslist()
+  },
+  methods: {
+    // 监听选择考核项目
+   async getAssessId(data){
+        // 根据选中的考核项目请求具体职责
+        const dutyFrom={
+            page: 1, 
+            pagesize: 10000,
+            state:1,
+            parentId:''
+        }
+        dutyFrom.parentId=data;
+        const res = await dutylist(dutyFrom)
+        this.dutylist=res.data.list
+        if(data==""){
+            this.showDuty=false;
+        }else{
+            this.showDuty=true;
+        }  
+    },
+    // 监听选择考核类别
+    async getClassId(data){
+        // 根据选中的考核类别请求考核项目
+        const assessFrom={
+            page: 1, 
+            pagesize: 10000,
+            state:1,
+            parentId:''
+        }
+        assessFrom.parentId=data;
+        const res = await assessList(assessFrom)
+        this.assessList=res.data.list
+        if(data==""){
+            this.showAssess=false;
+        }else{
+            this.showAssess=true;
+        }  
+    },
+      // 获取考核类别列表
+    async getDutyclasslist(){
+       const res = await dutyclasslist(this.searchList)
+       this.dutyclasslist=res.data.list
+    },
+      // 开关状态监听
+   async changeVal(val,id){
+       console.log(val)
+      this.switchFrom.outid=id
+      if (val==1) {
+        this.switchFrom.state=1;
+        const res = await eitespecdutystate(this.switchFrom)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '修改状态成功',
+                    showClose: true
+                  })
+                  this.getTableData()
+                }
+      } else {
+        this.switchFrom.state=2;
+        const res = await eitespecdutystate(this.switchFrom)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '修改状态成功',
+                    showClose: true
+                  })
+                  this.getTableData()
+                }
+      }
+    },
+    methodFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.label}`
+    },
+    tagTypeFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.type}`
+    },
+    //  选中api
+    handleSelectionChange(val) {
+      this.apis = val
+    },
+    async onDelete() {
+      const ids = this.apis.forEach(item => item.ID)
+      const res = await deleteApisByIds({ ids })
+      if (res.code === 0) {
+        this.$message({
+          type: 'success',
+          message: res.msg
+        })
+        if (this.tableData.length === ids.length && this.page > 1) {
+          this.page--
+        }
+        this.deleteVisible = false
+        this.getTableData()
+      }
+    },
+    // 排序
+    sortChange({ prop, order }) {
+      if (prop) {
+        this.searchInfo.orderKey = toSQLLine(prop)
+        this.searchInfo.desc = order === 'descending'
+      }
+      this.getTableData()
+    },
+    onReset() {
+      this.searchInfo = {}
+    },
+    // 条件搜索前端看此方法
+    onSubmit() {
+      this.page = 1
+      this.pageSize = 10
+      this.getTableData()
+    },
+    initForm() {
+      this.$refs.apiForm.resetFields()
+      this.form = {
+      }
+    },
+    closeDialog() {
+      this.initForm()
+      this.dialogFormVisible = false
+    },
+    openDialog(type) {
+      switch (type) {
+        case 'addApi':
+          this.dialogTitle = '新增'
+          break
+        case 'edit':
+          this.dialogTitle = '编辑'
+          break
+        default:
+          break
+      }
+      this.type = type
+      this.dialogFormVisible = true
+    },
+    async editApi(row) {
+      this.editFrom.outid=row.outId
+      const res = await getdutyclassinfo(this.editFrom)
+      this.form = res.data
+      this.openDialog('edit')
+    },
+    //删除操作
+    async deleteOperate(row) {
+      this.$confirm('此操作将永久删除, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(async() => {
+          this.deleFrom.state=3;
+          console.log(row.outID)
+          this.deleFrom.outid=row.outId;
+          const res = await eitespecdutystate(this.deleFrom)
+          if (res.code === 0) {
+            
+            this.$message({
+              type: 'success',
+              message: '删除成功!'
+            })
+            
+             this.getTableData()
+          }
+        })
+    },
+    async enterDialog() {
+      this.$refs.apiForm.validate(async valid => {
+        if (valid) {
+          switch (this.type) {
+            case 'addApi':
+              {
+                const res = await adddutyclass(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '添加成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+
+              break
+            case 'edit':
+              {
+                const res = await eitedutyclassinfo(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '编辑成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+              break
+            default:
+              // eslint-disable-next-line no-lone-blocks
+              {
+                this.$message({
+                  type: 'error',
+                  message: '未知操作',
+                  showClose: true
+                })
+              }
+              break
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.button-box {
+  padding: 10px 20px;
+  .el-button {
+    float: right;
+  }
+}
+.warning {
+  color: #dc143c;
+}
+</style>

web/src/view/performance/dataEntry/beAssessed.vue

@@ -0,0 +1,543 @@
+<template>
+<!-- 被考核部门录入 -->
+  <div>
+    <div class="gva-search-box">
+      <el-form ref="searchForm" :inline="true" :model="searchInfo">
+        <el-form-item label="考核类别名称">
+          <el-input
+            placeholder="请输入名称"
+            v-model="searchInfo.title"
+            clearable>
+          </el-input>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="gva-table-box">
+      <div class="gva-btn-list">
+        <el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog('addApi')">新增</el-button>
+      </div>
+      <el-table :data="tableData" @sort-change="sortChange" @selection-change="handleSelectionChange">
+        <!-- <el-table-column
+          type="selection"
+          width="55"
+        /> -->
+        <el-table-column align="left" label="考核类别" prop="classTitle"/>
+        <el-table-column align="left" label="考核项目" prop="assessTitle"/>
+        <el-table-column align="left" label="具体职责" prop="duryTitle"/>
+        <el-table-column align="left" label="部门名称" prop="parentTitle">
+            <template #default="scope">
+                {{scope.row.groupTitle}}{{scope.row.parentTitle}}
+             </template>
+        </el-table-column>
+        <el-table-column align="left" label="状态">
+            <template #default="scope">
+                <el-switch
+                    inline-prompt 
+                    active-text="正常" 
+                    inactive-text="禁止"
+                    v-model="scope.row.state"
+                    active-color="#13ce66"
+                    inactive-color="#ff4949"
+                    :active-value=1
+                    :inactive-value=2
+                    @change="changeVal($event,scope.row.outId)"
+                    />
+             </template>
+        </el-table-column>
+        <el-table-column align="left" label="分值" prop="rescore"/>
+        <el-table-column align="left" fixed="right" label="操作" width="200">
+          <template #default="scope">
+            <el-button
+              icon="el-icon-edit"
+              size="small"
+              type="text"
+              @click="editApi(scope.row)"
+            >编辑</el-button>
+            <el-button
+              icon="el-icon-delete"
+              size="small"
+              type="text"
+              @click="deleteOperate(scope.row)"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="gva-pagination">
+        <el-pagination
+          :current-page="page"
+          :page-size="pageSize"
+          :page-sizes="[10, 30, 50, 100]"
+          :total="total"
+          layout="total, sizes, prev, pager, next, jumper"
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+        />
+      </div>
+
+    </div>
+    <!-- 添加 -->
+    <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" :title="dialogTitle" width="30%">
+      
+      <el-form ref="apiForm" :model="form" :rules="rules" label-width="150px">
+        
+          <el-form-item label="所属考核项目">
+          <span>
+            <el-tag v-if="addChildInfo.title!=''">{{addChildInfo.title}}</el-tag>
+            <dutyDialog @checkedInfo="getCheckedfrom"></dutyDialog>
+          </span>
+        </el-form-item>
+       <el-form-item label="选择部门" prop="parentId">
+          <el-cascader clearable v-model="form.parentId" :options="grouplist" :show-all-levels="false" :props="props"></el-cascader>
+        </el-form-item>
+        
+        <el-form-item label="分值" prop="score">
+          <el-input v-model="form.score" autocomplete="off" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button size="small" @click="closeDialog">取 消</el-button>
+          <el-button size="small" type="primary" @click="enterDialog">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <!-- 编辑 -->
+    <el-dialog v-model="editDialogFormVisible" :before-close="closeEditDialog" title="编辑" width="30%">
+      
+      <el-form ref="apiForm" :model="editForm" :rules="editRules" label-width="150px">
+        
+          <el-form-item label="所属考核项目">
+          <span>
+            <el-tag v-if="editChildInfo.title!=''">{{editChildInfo.title}}</el-tag>
+            <dutyDialog @checkedInfo="getEditCheckedfrom"></dutyDialog>
+          </span>
+        </el-form-item>
+       <el-form-item label="选择部门" prop="parentId">
+          <el-cascader clearable v-model="editForm.parentId" :options="grouplist" :show-all-levels="false" :props="props"></el-cascader>
+        </el-form-item>
+        <el-form-item label="分值" prop="rescore">
+          <el-input v-model="editForm.rescore"/>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button size="small" @click="closeEditDialog">取 消</el-button>
+          <el-button size="small" type="primary" @click="editInfo">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+// 获取列表内容封装在mixins内部  getTableData方法 初始化已封装完成 条件搜索时候 请把条件安好后台定制的结构体字段 放到 this.searchInfo 中即可实现条件搜索
+
+import {
+  specdutylist,
+  adddepartdutyinfo, 
+  getspecdutyinfo,
+  eitespecdutyinfo,
+  dutyclasslist,
+  assessList,
+  dutylist,
+  eitespecdutystate,
+  eitedepartdutyinfo
+} from '@/api/dataEntry'
+import {
+  getgroupdepartmap,
+} from '@/api/group'
+import infoList from '@/mixins/infoList'
+import { toSQLLine } from '@/utils/stringFun'
+import dutyDialog from '@/components/dutyDialog/index.vue'
+const methodOptions = [
+  {
+    value: 'POST',
+    label: '创建',
+    type: 'success'
+  },
+  {
+    value: 'GET',
+    label: '查看',
+    type: ''
+  },
+  {
+    value: 'PUT',
+    label: '更新',
+    type: 'warning'
+  },
+  {
+    value: 'DELETE',
+    label: '删除',
+    type: 'danger'
+  }
+]
+
+export default {
+  name: 'Api',
+  components: {
+    dutyDialog
+  },
+  mixins: [infoList],
+  data() {
+    return {
+      editForm:{
+      },
+      editDialogFormVisible:false,
+      addChildInfo:{
+        title:''
+      },
+      editChildInfo:{
+        title:''
+      },
+      props: {
+        value: "id",
+        label: "name",
+        children: "children",
+        emitPath:false
+      },
+        showDuty:false,
+        assessList:{},
+        dutylist:{},
+        showAssess:false,
+        searchList:{
+        page:1,
+        pagesize:10000,
+        state:1,
+      },
+        deleFrom:{
+        outid:'',
+        state:Number
+      },
+        switchFrom:{
+        outid:'',
+        state:Number
+      },
+      editFrom:{
+          outid:'',
+          rescore:'',
+          score:Number
+      },
+      deleteVisible: false,
+      listApi: specdutylist,
+      dialogFormVisible: false,
+      dialogTitle: '新增',
+      apis: [],
+      form: {
+        parentId:'',
+        dutyId:'',
+      },
+      methodOptions: methodOptions,
+      type: '',
+      rules: {
+        parentId: [{ required: true, message: '请选择部门', trigger: 'blur' }],
+       score: [{ required: true, message: '请输入分值', trigger: 'blur' }],
+      },
+      editRules: {
+        parentId: [{ required: true, message: '请选择部门', trigger: 'blur' }],
+        rescore: [{ required: true, message: '请输入分值', trigger: 'blur' }],
+      }
+    }
+  },
+  created() {
+    this.getTableData()
+    this.getDutyclasslist()
+    this.getGrouplist()
+  },
+  methods: {
+    // 编辑提交
+    async editInfo(){
+      // this.editform.userid=this.editform.userid.toString();
+      // delete this.editform.id
+      this.editForm.score=parseInt(this.editForm.rescore);
+      this.editForm.dutyId=this.editForm.dutyId.toString();
+      this.editForm.parentId=this.editForm.parentId.toString();
+      const res = await eitedepartdutyinfo(this.editForm)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '编辑成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeEditDialog()
+    },
+    // 修改时获取选中组件值
+    getEditCheckedfrom(data){
+      this.editChildInfo=data
+      this.editForm.dutyId=this.editChildInfo.outId
+    },
+    // 获取部门
+    async getGrouplist(){
+      const res = await getgroupdepartmap()
+      this.grouplist=res.data.list
+
+    },
+    // 添加获取选中组件值
+    getCheckedfrom(data){
+      this.addChildInfo=data
+    },
+    // 监听选择考核项目
+   async getAssessId(data){
+        // 根据选中的考核项目请求具体职责
+        const dutyFrom={
+            page: 1, 
+            pagesize: 10000,
+            state:1,
+            parentId:''
+        }
+        dutyFrom.parentId=data;
+        const res = await dutylist(dutyFrom)
+        this.dutylist=res.data.list
+        if(data==""){
+            this.showDuty=false;
+        }else{
+            this.showDuty=true;
+        }  
+    },
+    // 监听选择考核类别
+    async getClassId(data){
+        // 根据选中的考核类别请求考核项目
+        const assessFrom={
+            page: 1, 
+            pagesize: 10000,
+            state:1,
+            parentId:''
+        }
+        assessFrom.parentId=data;
+        const res = await assessList(assessFrom)
+        this.assessList=res.data.list
+        if(data==""){
+            this.showAssess=false;
+        }else{
+            this.showAssess=true;
+        }  
+    },
+      // 获取考核类别列表
+    async getDutyclasslist(){
+       const res = await dutyclasslist(this.searchList)
+       this.dutyclasslist=res.data.list
+    },
+      // 开关状态监听
+   async changeVal(val,id){
+       console.log(val)
+      this.switchFrom.outid=id
+      if (val==1) {
+        this.switchFrom.state=1;
+        const res = await eitespecdutystate(this.switchFrom)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '修改状态成功',
+                    showClose: true
+                  })
+                  this.getTableData()
+                }
+      } else {
+        this.switchFrom.state=2;
+        const res = await eitespecdutystate(this.switchFrom)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '修改状态成功',
+                    showClose: true
+                  })
+                  this.getTableData()
+                }
+      }
+    },
+
+    methodFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.label}`
+    },
+    tagTypeFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.type}`
+    },
+    //  选中api
+    handleSelectionChange(val) {
+      this.apis = val
+    },
+    async onDelete() {
+      const ids = this.apis.forEach(item => item.ID)
+      const res = await deleteApisByIds({ ids })
+      if (res.code === 0) {
+        this.$message({
+          type: 'success',
+          message: res.msg
+        })
+        if (this.tableData.length === ids.length && this.page > 1) {
+          this.page--
+        }
+        this.deleteVisible = false
+        this.getTableData()
+      }
+    },
+    // 排序
+    sortChange({ prop, order }) {
+      if (prop) {
+        this.searchInfo.orderKey = toSQLLine(prop)
+        this.searchInfo.desc = order === 'descending'
+      }
+      this.getTableData()
+    },
+    onReset() {
+      this.searchInfo = {}
+    },
+    // 条件搜索前端看此方法
+    onSubmit() {
+      this.page = 1
+      this.pageSize = 10
+      this.getTableData()
+    },
+    initForm() {
+      this.$refs.apiForm.resetFields()
+      this.form = {
+        parentId:'',
+        dutyId:'',
+      }
+    },
+    editInitForm (){
+      this.editForm = {
+      }
+    },
+    closeDialog() {
+      this.initForm()
+      this.dialogFormVisible = false
+    },
+    closeEditDialog() {
+      this.editChildInfo={
+        title:''
+      }
+      this.editInitForm()
+      this.editDialogFormVisible = false
+    },
+    openDialog(type) {
+      switch (type) {
+        case 'addApi':
+          this.dialogTitle = '新增'
+          break
+        case 'edit':
+          this.dialogTitle = '编辑'
+          break
+        default:
+          break
+      }
+      this.type = type
+      this.dialogFormVisible = true
+    },
+    //  editApi:async(row) => {
+    //   this.editFrom.outid=row.outId
+    //   const res = await getspecdutyinfo(this.editFrom)
+    //   this.editChildInfo.title=res.data.duryTitle
+    //   this.editForm = res.data
+    //   this.$set(this.editForm,'rescore',res.data.rescore)
+    //   this.editForm.parentId=parseInt(this.editForm.parentId);
+    //   this.editDialogFormVisible=true
+    // },
+    
+    async editApi(row) {
+      
+      this.editFrom.outid=row.outId
+      const res = await getspecdutyinfo(this.editFrom)
+      
+      this.editChildInfo.title=res.data.duryTitle
+      this.editForm = res.data
+      this.editForm.score=res.data.rescore
+      // this.editForm.rescore=this.editForm.rescore.toString();
+      
+      this.editForm.parentId=parseInt(this.editForm.parentId);
+      console.log("editForm")
+      console.log(this.editForm)
+      this.editDialogFormVisible=true
+    },
+    //删除操作
+    async deleteOperate(row) {
+      this.$confirm('此操作将永久删除, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(async() => {
+          this.deleFrom.state=3;
+          console.log(row.outID)
+          this.deleFrom.outid=row.outId;
+          const res = await eitespecdutystate(this.deleFrom)
+          if (res.code === 0) {
+            
+            this.$message({
+              type: 'success',
+              message: '删除成功!'
+            })
+            
+             this.getTableData()
+          }
+        })
+    },
+    async enterDialog() {
+      this.$refs.apiForm.validate(async valid => {
+        if (valid) {
+          switch (this.type) {
+            case 'addApi':
+              {
+                console.log(this.addChildInfo)
+                this.form.dutyId=this.addChildInfo.outId
+                this.form.parentId=this.form.parentId.toString()
+                this.form.score=parseInt(this.form.score);
+                const res = await adddepartdutyinfo(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '添加成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+
+              break
+            case 'edit':
+              {
+                const res = await eitedutyclassinfo(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '编辑成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+              break
+            default:
+              // eslint-disable-next-line no-lone-blocks
+              {
+                this.$message({
+                  type: 'error',
+                  message: '未知操作',
+                  showClose: true
+                })
+              }
+              break
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.button-box {
+  padding: 10px 20px;
+  .el-button {
+    float: right;
+  }
+}
+.warning {
+  color: #dc143c;
+}
+</style>

web/src/view/performance/dataEntry/category.vue

@@ -0,0 +1,373 @@
+<template>
+<!-- 考核类别录入 -->
+  <div>
+    <div class="gva-search-box">
+      <el-form ref="searchForm" :inline="true" :model="searchInfo">
+        <el-form-item label="考核类别名称">
+          <el-input
+            placeholder="请输入名称"
+            v-model="searchInfo.title"
+            clearable>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="考核类别状态">
+          <el-select v-model="searchInfo.state" clearable placeholder="请选择状态">
+            <el-option :value=1 label="正常">正常</el-option>
+            <el-option :value=2 label="禁止">禁止</el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
+          <el-button size="mini" icon="el-icon-refresh" @click="onReset">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="gva-table-box">
+      <div class="gva-btn-list">
+        <el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog('addApi')">新增</el-button>
+        <!-- <el-popover v-model:visible="deleteVisible" placement="top" width="160">
+          <p>确定要删除吗？</p>
+          <div style="text-align: right; margin-top: 8px;">
+            <el-button size="mini" type="text" @click="deleteVisible = false">取消</el-button>
+            <el-button size="mini" type="primary" @click="onDelete">确定</el-button>
+          </div>
+          <template #reference>
+            <el-button icon="el-icon-delete" size="mini" :disabled="!apis.length" style="margin-left: 10px;">删除</el-button>
+          </template>
+        </el-popover> -->
+      </div>
+      <el-table :data="tableData" @sort-change="sortChange" @selection-change="handleSelectionChange">
+        <!-- <el-table-column
+          type="selection"
+          width="55"
+        /> -->
+        <el-table-column align="left" label="考核类别ID" prop="outId"/>
+        <el-table-column align="left" label="考核类别名称" prop="title"/>
+        <el-table-column align="left" label="考核类别状态">
+            <template #default="scope">
+                <el-switch
+                    inline-prompt 
+                    active-text="正常" 
+                    inactive-text="禁止"
+                    v-model="scope.row.state"
+                    active-color="#13ce66"
+                    inactive-color="#ff4949"
+                    :active-value=1
+                    :inactive-value=2
+                    @change="changeVal($event,scope.row.outId)"
+                    />
+             </template>
+        </el-table-column>
+        <el-table-column align="left" fixed="right" label="操作" width="200">
+          <template #default="scope">
+            <el-button
+              icon="el-icon-edit"
+              size="small"
+              type="text"
+              @click="editApi(scope.row)"
+            >编辑</el-button>
+            <el-button
+              icon="el-icon-delete"
+              size="small"
+              type="text"
+              @click="deleteOperate(scope.row)"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="gva-pagination">
+        <el-pagination
+          :current-page="page"
+          :page-size="pageSize"
+          :page-sizes="[10, 30, 50, 100]"
+          :total="total"
+          layout="total, sizes, prev, pager, next, jumper"
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+        />
+      </div>
+
+    </div>
+
+    <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" :title="dialogTitle" width="20%">
+      
+      <el-form ref="apiForm" :model="form" :rules="rules" label-width="150px">
+        <el-form-item label="考核类别名称" prop="title">
+          <el-input v-model="form.title" autocomplete="off" />
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button size="small" @click="closeDialog">取 消</el-button>
+          <el-button size="small" type="primary" @click="enterDialog">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+// 获取列表内容封装在mixins内部  getTableData方法 初始化已封装完成 条件搜索时候 请把条件安好后台定制的结构体字段 放到 this.searchInfo 中即可实现条件搜索
+
+import {
+  dutyclasslist,
+  adddutyclass,
+  getdutyclassinfo,
+  eitedutyclassinfo,
+  statedutyclass
+} from '@/api/dataEntry'
+import infoList from '@/mixins/infoList'
+import { toSQLLine } from '@/utils/stringFun'
+import warningBar from '@/components/warningBar/warningBar.vue'
+const methodOptions = [
+  {
+    value: 'POST',
+    label: '创建',
+    type: 'success'
+  },
+  {
+    value: 'GET',
+    label: '查看',
+    type: ''
+  },
+  {
+    value: 'PUT',
+    label: '更新',
+    type: 'warning'
+  },
+  {
+    value: 'DELETE',
+    label: '删除',
+    type: 'danger'
+  }
+]
+
+export default {
+  name: 'Api',
+  components: {
+    warningBar
+  },
+  mixins: [infoList],
+  data() {
+    return {
+        deleFrom:{
+        outid:'',
+        state:Number
+      },
+        switchFrom:{
+        outid:'',
+        state:Number
+      },
+      editFrom:{
+          outid:'',
+      },
+      deleteVisible: false,
+      listApi: dutyclasslist,
+      dialogFormVisible: false,
+      dialogTitle: '新增',
+      apis: [],
+      form: {
+        title:'',
+      },
+      methodOptions: methodOptions,
+      type: '',
+      rules: {
+        title: [{ required: true, message: '考核类别名称', trigger: 'blur' }],
+       
+      }
+    }
+  },
+  created() {
+    this.getTableData()
+  },
+  methods: {
+      // 开关状态监听
+   async changeVal(val,id){
+       console.log(val)
+      this.switchFrom.outid=id
+      if (val==1) {
+        this.switchFrom.state=1;
+        const res = await statedutyclass(this.switchFrom)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '修改状态成功',
+                    showClose: true
+                  })
+                  this.getTableData()
+                }
+      } else {
+        this.switchFrom.state=2;
+        const res = await statedutyclass(this.switchFrom)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '修改状态成功',
+                    showClose: true
+                  })
+                  this.getTableData()
+                }
+      }
+    },
+    methodFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.label}`
+    },
+    tagTypeFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.type}`
+    },
+    //  选中api
+    handleSelectionChange(val) {
+      this.apis = val
+    },
+    async onDelete() {
+      const ids = this.apis.forEach(item => item.ID)
+      const res = await deleteApisByIds({ ids })
+      if (res.code === 0) {
+        this.$message({
+          type: 'success',
+          message: res.msg
+        })
+        if (this.tableData.length === ids.length && this.page > 1) {
+          this.page--
+        }
+        this.deleteVisible = false
+        this.getTableData()
+      }
+    },
+    // 排序
+    sortChange({ prop, order }) {
+      if (prop) {
+        this.searchInfo.orderKey = toSQLLine(prop)
+        this.searchInfo.desc = order === 'descending'
+      }
+      this.getTableData()
+    },
+    onReset() {
+      this.searchInfo = {}
+    },
+    // 条件搜索前端看此方法
+    onSubmit() {
+      this.page = 1
+      this.pageSize = 10
+      this.getTableData()
+    },
+    initForm() {
+      this.$refs.apiForm.resetFields()
+      this.form = {
+        path: '',
+        apiGroup: '',
+        method: '',
+        description: ''
+      }
+    },
+    closeDialog() {
+      this.initForm()
+      this.dialogFormVisible = false
+    },
+    openDialog(type) {
+      switch (type) {
+        case 'addApi':
+          this.dialogTitle = '新增'
+          break
+        case 'edit':
+          this.dialogTitle = '编辑'
+          break
+        default:
+          break
+      }
+      this.type = type
+      this.dialogFormVisible = true
+    },
+    async editApi(row) {
+      this.editFrom.outid=row.outId
+      const res = await getdutyclassinfo(this.editFrom)
+      this.form = res.data
+      this.openDialog('edit')
+    },
+    //删除操作
+    async deleteOperate(row) {
+      this.$confirm('此操作将永久删除, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(async() => {
+          this.deleFrom.state=3;
+          console.log(row.outID)
+          this.deleFrom.outid=row.outId;
+          const res = await statedutyclass(this.deleFrom)
+          if (res.code === 0) {
+            
+            this.$message({
+              type: 'success',
+              message: '删除成功!'
+            })
+            
+             this.getTableData()
+          }
+        })
+    },
+    async enterDialog() {
+      this.$refs.apiForm.validate(async valid => {
+        if (valid) {
+          switch (this.type) {
+            case 'addApi':
+              {
+                const res = await adddutyclass(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '添加成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+
+              break
+            case 'edit':
+              {
+                const res = await eitedutyclassinfo(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '编辑成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+              break
+            default:
+              // eslint-disable-next-line no-lone-blocks
+              {
+                this.$message({
+                  type: 'error',
+                  message: '未知操作',
+                  showClose: true
+                })
+              }
+              break
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.button-box {
+  padding: 10px 20px;
+  .el-button {
+    float: right;
+  }
+}
+.warning {
+  color: #dc143c;
+}
+</style>

web/src/view/performance/dataEntry/duty.vue

@@ -0,0 +1,602 @@
+<template>
+<!-- 具体职责录入 -->
+  <div>
+    <div class="gva-search-box">
+      <el-form ref="searchForm" :inline="true" :model="searchInfo">
+        <el-form-item label="所属考核项目">
+          <span>
+            <el-tag v-if="childInfo.title!=''">{{childInfo.title}}</el-tag>
+            <projectDialog @checkedInfo="getCheckedInfo"></projectDialog>
+          </span>
+          
+        </el-form-item>
+        <el-form-item label="考核项目状态">
+          <el-select v-model="searchInfo.state" clearable placeholder="请选择状态">
+            <el-option :value=1 label="正常">正常</el-option>
+            <el-option :value=2 label="禁止">禁止</el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="考核项目名称">
+          <el-input
+            placeholder="请输入名称"
+            v-model="searchInfo.title"
+            clearable>
+          </el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
+          <el-button size="mini" icon="el-icon-refresh" @click="onReset">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="gva-table-box">
+      <div class="gva-btn-list">
+        <el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog('addApi')">新增</el-button>
+      </div>
+      <el-table :data="tableData" @sort-change="sortChange" @selection-change="handleSelectionChange">
+        <!-- <el-table-column
+          type="selection"
+          width="55"
+        /> -->
+        <el-table-column align="left" label="所属考核项目" prop="parentTitle"/>
+        <el-table-column align="left" label="具体职责ID" prop="outId"/>
+        <el-table-column align="left" label="具体职责名称" prop="title"/>
+        <el-table-column align="left" label="考核部门" prop="dumpTitle"/>
+        <el-table-column align="left" label="考核人" prop="username"/>
+        <el-table-column align="left" label="具体职责状态">
+            <template #default="scope">
+                <el-switch
+                    inline-prompt 
+                    active-text="正常" 
+                    inactive-text="禁止"
+                    v-model="scope.row.state"
+                    active-color="#13ce66"
+                    inactive-color="#ff4949"
+                    :active-value=1
+                    :inactive-value=2
+                    @change="changeVal($event,scope.row.outId)"
+                    />
+             </template>
+        </el-table-column>
+        <el-table-column align="left" fixed="right" label="操作" width="200">
+          <template #default="scope">
+            <el-button
+              icon="el-icon-edit"
+              size="small"
+              type="text"
+              @click="editApi(scope.row)"
+            >编辑</el-button>
+            <el-button
+              icon="el-icon-delete"
+              size="small"
+              type="text"
+              @click="deleteOperate(scope.row)"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="gva-pagination">
+        <el-pagination
+          :current-page="page"
+          :page-size="pageSize"
+          :page-sizes="[10, 30, 50, 100]"
+          :total="total"
+          layout="total, sizes, prev, pager, next, jumper"
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+        />
+      </div>
+
+    </div>
+    <!-- 添加 -->
+    <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" :title="dialogTitle" width="25%">
+      <el-form ref="apiForm" :model="form" :rules="rules" label-width="125px">
+        <el-form-item label="所属考核项目">
+          <span>
+            <el-tag v-if="addChildInfo.title!=''">{{addChildInfo.title}}</el-tag>
+            <projectDialog @checkedInfo="getCheckedfrom"></projectDialog>
+          </span>
+        </el-form-item>
+        <el-form-item label="具体职责名称" prop="title">
+          <el-input
+            type="textarea"
+            :autosize="{ minRows: 2, maxRows: 4}"
+            placeholder="请输入内容"
+            v-model="form.title">
+          </el-input>
+        </el-form-item>
+        <el-form-item label="考核部门类型" prop="type">
+          <el-radio border size="small" v-model="form.type" :label=1>指定人</el-radio>  
+          <el-radio border size="small" v-model="form.type" :label=2>指定部门</el-radio>
+        </el-form-item>
+        <el-form-item v-if="form.type==2" label="选择部门" prop="userid">
+          <el-cascader clearable v-model="form.userid" :options="grouplist" :show-all-levels="false" :props="props"></el-cascader>
+        </el-form-item>
+        <el-form-item v-if="form.type==1" label="选择考核人" prop="userid">
+          <el-cascader clearable v-model="form.userid" :options="grouplistBackup" :show-all-levels="false" :props="userProps"></el-cascader>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button size="small" @click="closeDialog">取 消</el-button>
+          <el-button size="small" type="primary" @click="enterDialog">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <!-- 编辑 -->
+    <el-dialog v-model="editDialogFormVisible" :before-close="closeEditDialog" title="编辑" width="25%">
+      <el-form ref="apiForm" :model="editform" :rules="editrules" label-width="125px">
+        <el-form-item label="所属考核项目">
+          <span>
+            <el-tag v-if="editChildInfo.title!=''">{{editChildInfo.title}}</el-tag>
+            <projectDialog @checkedInfo="getEditCheckedfrom"></projectDialog>
+          </span>
+        </el-form-item>
+        <el-form-item label="具体职责名称" prop="title">
+          <el-input
+            type="textarea"
+            :autosize="{ minRows: 2, maxRows: 4}"
+            placeholder="请输入内容"
+            v-model="editform.title">
+          </el-input>
+        </el-form-item>
+        <el-form-item label="考核部门类型" prop="type">
+          <el-radio border size="small" v-model="editform.userType" :label=1>指定人</el-radio>  
+          <el-radio border size="small" v-model="editform.userType" :label=2>指定部门</el-radio>
+        </el-form-item>
+        <el-form-item v-if="editform.userType==2" label="选择部门" prop="userid">
+          <el-cascader clearable v-model="editform.dump" :options="grouplist" :show-all-levels="false" :props="props"></el-cascader>
+        </el-form-item>
+        <el-form-item v-if="editform.userType==1" label="选择考核人" prop="userid">
+          <el-cascader clearable v-model="editform.userDumpId" :options="grouplistBackup" :show-all-levels="false" :props="userProps"></el-cascader>
+        </el-form-item>
+        <!-- 16047344045376832 -->
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button size="small" @click="closeEditDialog">取 消</el-button>
+          <el-button size="small" type="primary" @click="editInfo">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+// 获取列表内容封装在mixins内部  getTableData方法 初始化已封装完成 条件搜索时候 请把条件安好后台定制的结构体字段 放到 this.searchInfo 中即可实现条件搜索
+
+import {
+  dutylist,
+  assessList,
+  adddutyinfo,
+  getdutyinfo,
+  eitedutystate,
+  eitedutyinfo
+} from '@/api/dataEntry'
+import {
+  getgroupdepartmap,
+  getgroupuser
+} from '@/api/group'
+
+import projectDialog from '@/components/projectDialog/index.vue'
+import infoList from '@/mixins/infoList'
+import { toSQLLine } from '@/utils/stringFun'
+import warningBar from '@/components/warningBar/warningBar.vue'
+const methodOptions = [
+  {
+    value: 'POST',
+    label: '创建',
+    type: 'success'
+  },
+  {
+    value: 'GET',
+    label: '查看',
+    type: ''
+  },
+  {
+    value: 'PUT',
+    label: '更新',
+    type: 'warning'
+  },
+  {
+    value: 'DELETE',
+    label: '删除',
+    type: 'danger'
+  }
+]
+
+export default {
+  name: 'Api',
+  components: {
+    warningBar,
+    projectDialog
+  },
+  mixins: [infoList],
+  data() {
+    return {
+      editChildInfo:{
+        title:''
+      },
+      editform:{},
+      editDialogFormVisible:false,
+      props: {
+        value: "id",
+        label: "name",
+        children: "children",
+        emitPath:false
+      },
+      userProps: {
+        value: "id",
+        label: "name",
+        children: "groupUser",
+        emitPath:false
+      },
+      grouplist:{},
+      grouplistBackup:{},
+      groupListFrom:{
+        parentid:3
+      },
+      childInfo:{
+        title:''
+      },
+      addChildInfo:{
+        title:''
+      },
+      projectTitle:'',
+      dutyclasslist:{},
+      searchList:{
+        page:1,
+        pagesize:10000,
+      },
+      dutyclasslist:'',
+        deleFrom:{
+        outid:'',
+        state:Number
+      },
+        switchFrom:{
+        outid:'',
+        state:Number
+      },
+      editFrom:{
+          outid:'',
+      },
+      deleteVisible: false,
+      listApi: dutylist,
+      dialogFormVisible: false,
+      dialogTitle: '新增',
+      apis: [],
+      form: {
+        title:'',
+
+      },
+      methodOptions: methodOptions,
+      type: '',
+      rules: {
+        parentId: [{ required: true, message: '请选择所属考核类别', trigger: 'blur' }],
+        title: [{ required: true, message: '考核项目名称', trigger: 'blur' }],
+        type: [{ required: true, message: '考核部门类型', trigger: 'blur' }],
+        userid: [{ required: true, message: '考核人或部门', trigger: 'blur' }],
+      }
+    }
+  },
+  created() {
+    this.getTableData()
+    // this.getDutyclasslist()
+    this.getGrouplist()
+    this.getSystemadminlist()
+  },
+  methods: {
+    // 添加获取选中组件值
+    getEditCheckedfrom(data){
+      this.editChildInfo=data
+      this.editform.parentId=this.editChildInfo.outId
+    },
+    // 添加获取选中组件值
+    getCheckedfrom(data){
+      this.addChildInfo=data
+    },
+    // 获取部门
+    async getGrouplist(){
+      const res = await getgroupdepartmap()
+      this.grouplist=res.data.list
+
+    },
+    // async getGrouplist(){
+    //    const res = await grouplist(this.groupListFrom)
+    //    this.grouplist=res.data.list
+    //   //  取消vue的双向绑定
+    //    this.grouplistBackup=JSON.parse(JSON.stringify(res.data.list))
+    //    this.grouplist.forEach((data) => {
+    //         data.children.forEach((res) => {
+              
+    //           if(res.hasOwnProperty('children')){
+    //             delete res.children
+    //           }
+    //         });
+    //     });
+    //   // 下是循环人员列表
+    //    this.grouplistBackup.forEach((data) => {
+    //         data.children.forEach(async(res) => {
+    //           const systemadminFrom = {
+    //             page:1,
+    //             pagesize:10000,
+    //             branchFactoryId:''
+    //           }
+    //           systemadminFrom.branchFactoryId=res.id
+    //           const result = await stafflist(systemadminFrom)
+
+    //           res.children = result.data.list;
+    //           // this.$set(res,"children", result.data.list)
+              
+              
+    //         });
+    //     });
+    //     console.log("部门列表无基层")
+    //     console.log(this.grouplist)
+    //     console.log("员工列表")
+    //     console.log(this.grouplistBackup)
+    // },
+    // 获取员工列表
+    async getSystemadminlist(){
+      const res = await getgroupuser()
+      this.grouplistBackup=res.data.list
+    },
+    // 获取选中组件值
+    getCheckedInfo(data){
+      this.childInfo=data
+    },
+    // 获取考核类别列表
+    async getDutyclasslist(){
+       const res = await dutyclasslist(this.searchList)
+       this.dutyclasslist=res.data.list
+    },
+      // 开关状态监听
+   async changeVal(val,id){
+       console.log(val)
+      this.switchFrom.outid=id
+      if (val==1) {
+        this.switchFrom.state=1;
+        const res = await eitedutystate(this.switchFrom)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '修改状态成功',
+                    showClose: true
+                  })
+                  this.getTableData()
+                }
+      } else {
+        this.switchFrom.state=2;
+        const res = await eitedutystate(this.switchFrom)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '修改状态成功',
+                    showClose: true
+                  })
+                  this.getTableData()
+                }
+      }
+    },
+    methodFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.label}`
+    },
+    tagTypeFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.type}`
+    },
+    //  选中api
+    handleSelectionChange(val) {
+      this.apis = val
+    },
+    async onDelete() {
+      const ids = this.apis.forEach(item => item.ID)
+      const res = await deleteApisByIds({ ids })
+      if (res.code === 0) {
+        this.$message({
+          type: 'success',
+          message: res.msg
+        })
+        if (this.tableData.length === ids.length && this.page > 1) {
+          this.page--
+        }
+        this.deleteVisible = false
+        this.getTableData()
+      }
+    },
+    // 排序
+    sortChange({ prop, order }) {
+      if (prop) {
+        this.searchInfo.orderKey = toSQLLine(prop)
+        this.searchInfo.desc = order === 'descending'
+      }
+      this.getTableData()
+    },
+    onReset() {
+      this.searchInfo = {};
+      this.childInfo={
+        title:''
+      }
+
+    },
+    // 条件搜索前端看此方法
+    onSubmit() {
+      this.page = 1
+      this.pageSize = 10
+      this.searchInfo.parentId=this.childInfo.outId
+      this.getTableData()
+    },
+    initForm() {
+      this.$refs.apiForm.resetFields()
+      this.form = {
+      }
+    },
+    editInitForm(){
+      this.editform = {
+      }
+    },
+    closeDialog() {
+      this.addChildInfo={
+        title:''
+      }
+      this.initForm()
+      this.dialogFormVisible = false
+    },
+    openDialog(type) {
+      switch (type) {
+        case 'addApi':
+          this.dialogTitle = '新增'
+          break
+        case 'edit':
+          this.dialogTitle = '编辑'
+          break
+        default:
+          break
+      }
+      this.type = type
+      this.dialogFormVisible = true
+    },
+    // 显示详情
+    async editApi(row) {
+      this.editFrom.outid=row.outId
+      const res = await getdutyinfo(this.editFrom)
+      this.editform = res.data
+      this.editform.parentId=res.data.parentIdStr
+      this.editChildInfo.title=res.data.parentTitle
+      console.log(this.editform)
+      this.editDialogFormVisible=true
+    },
+    //删除操作
+    async deleteOperate(row) {
+      this.$confirm('此操作将永久删除, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(async() => {
+          this.deleFrom.state=3;
+          console.log(row.outID)
+          this.deleFrom.outid=row.outId;
+          const res = await eitedutystate(this.deleFrom)
+          if (res.code === 0) {
+            
+            this.$message({
+              type: 'success',
+              message: '删除成功!'
+            })
+            
+             this.getTableData()
+          }
+        })
+    },
+    async editInfo(){
+      if(this.editform.userType==1){
+        delete this.editform.dump
+        this.editform.userid=this.editform.userDumpId
+      }
+      if(this.editform.userType==2){
+        delete this.editform.userDumpId
+        this.editform.userid=this.editform.dump
+      }
+      this.editform.type=this.editform.userType
+      this.editform.outid=this.editform.outId
+      this.editform.userid=this.editform.userid.toString();
+      delete this.editform.outId
+      delete this.editform.userDump
+      delete this.editform.userDumpId
+      delete this.editform.userType
+      delete this.editform.username
+      delete this.editform.username
+      // delete this.editform.id
+      delete this.editform.dump
+      delete this.editform.dumpTitle
+      delete this.editform.parentIdStr
+      delete this.editform.parentTitle
+      delete this.editform.partId
+      delete this.editform.time
+      delete this.editform.state
+      const res = await eitedutyinfo(this.editform)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '编辑成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeEditDialog()
+    },
+    closeEditDialog(){
+      this.editChildInfo={
+        title:''
+      }
+      this.editInitForm()
+      this.editDialogFormVisible = false
+    },
+    async enterDialog() {
+      console.log(this.grouplistBackup)
+      console.log(this.form.userid)
+      this.$refs.apiForm.validate(async valid => {
+        if (valid) {
+          switch (this.type) {
+            case 'addApi':
+              {
+                this.form.userid=this.form.userid.toString();
+                this.form.parentId=this.addChildInfo.outId
+                const res = await adddutyinfo(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '添加成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+
+              break
+            case 'edit':
+              {
+                const res = await eiteassessinfo(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '编辑成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+              break
+            default:
+              // eslint-disable-next-line no-lone-blocks
+              {
+                this.$message({
+                  type: 'error',
+                  message: '未知操作',
+                  showClose: true
+                })
+              }
+              break
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.button-box {
+  padding: 10px 20px;
+  .el-button {
+    float: right;
+  }
+}
+.warning {
+  color: #dc143c;
+}
+</style>

web/src/view/performance/dataEntry/project.vue

@@ -0,0 +1,395 @@
+<template>
+<!-- 考核项目录入 -->
+  <div>
+    <div class="gva-search-box">
+      <el-form ref="searchForm" :inline="true" :model="searchInfo">
+        <el-form-item label="考核项目名称">
+          <el-input
+            placeholder="请输入名称"
+            v-model="searchInfo.title"
+            clearable>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="考核项目状态">
+          <el-select v-model="searchInfo.state" clearable placeholder="请选择状态">
+            <el-option :value=1 label="正常">正常</el-option>
+            <el-option :value=2 label="禁止">禁止</el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="所属考核类别">
+          <el-select v-model="searchInfo.parentId" clearable placeholder="请选择状态">
+             <el-option
+              v-for="item in dutyclasslist"
+              :key="item.outId"
+              :label="item.title"
+              :value="item.outId">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
+          <el-button size="mini" icon="el-icon-refresh" @click="onReset">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="gva-table-box">
+      <div class="gva-btn-list">
+        <el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog('addApi')">新增</el-button>
+        <!-- <el-popover v-model:visible="deleteVisible" placement="top" width="160">
+          <p>确定要删除吗？</p>
+          <div style="text-align: right; margin-top: 8px;">
+            <el-button size="mini" type="text" @click="deleteVisible = false">取消</el-button>
+            <el-button size="mini" type="primary" @click="onDelete">确定</el-button>
+          </div>
+          <template #reference>
+            <el-button icon="el-icon-delete" size="mini" :disabled="!apis.length" style="margin-left: 10px;">删除</el-button>
+          </template>
+        </el-popover> -->
+      </div>
+      <el-table :data="tableData" @sort-change="sortChange" @selection-change="handleSelectionChange">
+        <!-- <el-table-column
+          type="selection"
+          width="55"
+        /> -->
+        <el-table-column align="left" label="所属考核类别" prop="parentTitle"/>
+        <el-table-column align="left" label="考核项目ID" prop="outId"/>
+        <el-table-column align="left" label="考核项目名称" prop="title"/>
+        <el-table-column align="left" label="考核项目说明" prop="content"/>
+        <el-table-column align="left" label="考核项目状态">
+            <template #default="scope">
+                <el-switch
+                    inline-prompt 
+                    active-text="正常" 
+                    inactive-text="禁止"
+                    v-model="scope.row.state"
+                    active-color="#13ce66"
+                    inactive-color="#ff4949"
+                    :active-value=1
+                    :inactive-value=2
+                    @change="changeVal($event,scope.row.outId)"
+                    />
+             </template>
+        </el-table-column>
+        <el-table-column align="left" fixed="right" label="操作" width="200">
+          <template #default="scope">
+            <el-button
+              icon="el-icon-edit"
+              size="small"
+              type="text"
+              @click="editApi(scope.row)"
+            >编辑</el-button>
+            <el-button
+              icon="el-icon-delete"
+              size="small"
+              type="text"
+              @click="deleteOperate(scope.row)"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="gva-pagination">
+        <el-pagination
+          :current-page="page"
+          :page-size="pageSize"
+          :page-sizes="[10, 30, 50, 100]"
+          :total="total"
+          layout="total, sizes, prev, pager, next, jumper"
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+        />
+      </div>
+
+    </div>
+
+    <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" :title="dialogTitle" width="20%">
+      
+      <el-form ref="apiForm" :model="form" :rules="rules" label-width="125px">
+        <el-form-item label="所属考核类别" prop="parentId">
+          <el-select v-model="form.parentId" clearable placeholder="请选择考核类别">
+             <el-option
+              v-for="item in dutyclasslist"
+              :key="item.outId"
+              :label="item.title"
+              :value="item.outId">
+            </el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="考核项目名称" prop="title">
+          <el-input v-model="form.title" autocomplete="off" />
+        </el-form-item>
+        <el-form-item label="考核项目说明" prop="content">
+          <el-input
+            type="textarea"
+            :autosize="{ minRows: 2, maxRows: 4}"
+            placeholder="请输入内容"
+            v-model="form.content">
+          </el-input>
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button size="small" @click="closeDialog">取 消</el-button>
+          <el-button size="small" type="primary" @click="enterDialog">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+// 获取列表内容封装在mixins内部  getTableData方法 初始化已封装完成 条件搜索时候 请把条件安好后台定制的结构体字段 放到 this.searchInfo 中即可实现条件搜索
+
+import {
+  dutyclasslist,
+  assessList,
+  addassessinfo,
+  getassessinfo,
+  eiteassessinfo,
+  eiteassessstate
+} from '@/api/dataEntry'
+import infoList from '@/mixins/infoList'
+import { toSQLLine } from '@/utils/stringFun'
+import warningBar from '@/components/warningBar/warningBar.vue'
+
+export default {
+  name: 'Api',
+  components: {
+    warningBar
+  },
+  mixins: [infoList],
+  data() {
+    return {
+      dutyclasslist:{},
+      searchList:{
+        page:1,
+        pagesize:10000,
+      },
+        deleFrom:{
+        outid:'',
+        state:Number
+      },
+        switchFrom:{
+        outid:'',
+        state:Number
+      },
+      editFrom:{
+          outid:'',
+      },
+      deleteVisible: false,
+      listApi: assessList,
+      dialogFormVisible: false,
+      dialogTitle: '新增',
+      apis: [],
+      form: {
+        title:'',
+      },
+      
+      type: '',
+      rules: {
+        parentId: [{ required: true, message: '请选择所属考核类别', trigger: 'blur' }],
+        title: [{ required: true, message: '考核项目名称', trigger: 'blur' }],
+        content: [{ required: true, message: '考核项目说明', trigger: 'blur' }],
+      }
+    }
+  },
+  created() {
+    this.getTableData()
+    this.getDutyclasslist()
+  },
+  methods: {
+    // 获取考核类别列表
+    async getDutyclasslist(){
+       const res = await dutyclasslist(this.searchList)
+       this.dutyclasslist=res.data.list
+    },
+      // 开关状态监听
+   async changeVal(val,id){
+       console.log(val)
+      this.switchFrom.outid=id
+      if (val==1) {
+        this.switchFrom.state=1;
+        const res = await eiteassessstate(this.switchFrom)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '修改状态成功',
+                    showClose: true
+                  })
+                  this.getTableData()
+                }
+      } else {
+        this.switchFrom.state=2;
+        const res = await eiteassessstate(this.switchFrom)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '修改状态成功',
+                    showClose: true
+                  })
+                  this.getTableData()
+                }
+      }
+    },
+    methodFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.label}`
+    },
+    tagTypeFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.type}`
+    },
+    //  选中api
+    handleSelectionChange(val) {
+      this.apis = val
+    },
+    async onDelete() {
+      const ids = this.apis.forEach(item => item.ID)
+      const res = await deleteApisByIds({ ids })
+      if (res.code === 0) {
+        this.$message({
+          type: 'success',
+          message: res.msg
+        })
+        if (this.tableData.length === ids.length && this.page > 1) {
+          this.page--
+        }
+        this.deleteVisible = false
+        this.getTableData()
+      }
+    },
+    // 排序
+    sortChange({ prop, order }) {
+      if (prop) {
+        this.searchInfo.orderKey = toSQLLine(prop)
+        this.searchInfo.desc = order === 'descending'
+      }
+      this.getTableData()
+    },
+    onReset() {
+      this.searchInfo = {}
+    },
+    // 条件搜索前端看此方法
+    onSubmit() {
+      this.page = 1
+      this.pageSize = 10
+      this.getTableData()
+    },
+    initForm() {
+      this.$refs.apiForm.resetFields()
+      this.form = {
+        path: '',
+        apiGroup: '',
+        method: '',
+        description: ''
+      }
+    },
+    closeDialog() {
+      this.initForm()
+      this.dialogFormVisible = false
+    },
+    openDialog(type) {
+      switch (type) {
+        case 'addApi':
+          this.dialogTitle = '新增'
+          break
+        case 'edit':
+          this.dialogTitle = '编辑'
+          break
+        default:
+          break
+      }
+      this.type = type
+      this.dialogFormVisible = true
+    },
+    async editApi(row) {
+      this.editFrom.outid=row.outId
+      const res = await getassessinfo(this.editFrom)
+      this.form = res.data
+      this.form.parentId=res.data.parentIdStr
+      this.openDialog('edit')
+    },
+    //删除操作
+    async deleteOperate(row) {
+      this.$confirm('此操作将永久删除, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(async() => {
+          this.deleFrom.state=3;
+          console.log(row.outID)
+          this.deleFrom.outid=row.outId;
+          const res = await eiteassessstate(this.deleFrom)
+          if (res.code === 0) {
+            
+            this.$message({
+              type: 'success',
+              message: '删除成功!'
+            })
+            
+             this.getTableData()
+          }
+        })
+    },
+    async enterDialog() {
+      this.$refs.apiForm.validate(async valid => {
+        if (valid) {
+          switch (this.type) {
+            case 'addApi':
+              {
+                const res = await addassessinfo(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '添加成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+
+              break
+            case 'edit':
+              {
+                const res = await eiteassessinfo(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '编辑成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+              break
+            default:
+              // eslint-disable-next-line no-lone-blocks
+              {
+                this.$message({
+                  type: 'error',
+                  message: '未知操作',
+                  showClose: true
+                })
+              }
+              break
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.button-box {
+  padding: 10px 20px;
+  .el-button {
+    float: right;
+  }
+}
+.warning {
+  color: #dc143c;
+}
+</style>

web/src/view/performance/index.vue

@@ -0,0 +1,17 @@
+<template>
+  <div>
+    <router-view v-slot="{ Component }">
+      <transition mode="out-in" name="el-fade-in-linear">
+        <keep-alive :include="$store.getters['router/keepAliveRouters']">
+          <component :is="Component" />
+        </keep-alive>
+      </transition>
+    </router-view>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'performance'
+}
+</script>

web/src/view/performance/plan/index.vue

@@ -0,0 +1,385 @@
+<template>
+<!-- 主要考核评分指标录入 -->
+  <div>
+    <div class="gva-search-box">
+      <el-form ref="searchForm" :inline="true" :model="searchInfo">
+        <el-form-item label="部门">
+          <el-select v-model="searchInfo.workSection" clearable placeholder="请选择部门">
+            <el-option value="1" label="煤焦分厂">煤焦分厂</el-option>
+            <el-option value="2" label="化产分厂">化产分厂</el-option>
+            <el-option value="3" label="甲醇分厂">甲醇分厂</el-option>
+            <el-option value="4" label="动力分厂">动力分厂</el-option>
+            <el-option value="5" label="生产部">生产部</el-option>
+            <el-option value="6" label="技术部">技术部</el-option>
+            <el-option value="7" label="质检中心">质检中心</el-option>
+            <el-option value="8" label="安全部">安全部</el-option>
+            <el-option value="9" label="环保部">环保部</el-option>
+            <el-option value="10" label="营销部">营销部</el-option>
+            <el-option value="11" label="仓储中心">仓储中心</el-option>
+            <el-option value="12" label="物流中心">物流中心</el-option>
+            <el-option value="13" label="人力资源部">人力资源部</el-option>
+            <el-option value="14" label="财务部">财务部</el-option>
+            <el-option value="15" label="综合办">综合办</el-option>
+            <el-option value="16" label="企管部">企管部</el-option>
+            <el-option value="17" label="保卫部">保卫部</el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button size="mini" type="primary" icon="el-icon-search" @click="onSubmit">查询</el-button>
+          <el-button size="mini" icon="el-icon-refresh" @click="onReset">重置</el-button>
+        </el-form-item>
+      </el-form>
+    </div>
+    <div class="gva-table-box">
+      <div class="gva-btn-list">
+        <el-button size="mini" type="primary" icon="el-icon-plus" @click="openDialog('addApi')">新增</el-button>
+        <el-button size="mini" type="primary" icon="el-icon-upload" @click="openDialog('addApi')">导入题库数据</el-button>
+        <el-popover v-model:visible="deleteVisible" placement="top" width="160">
+          <p>确定要删除吗？</p>
+          <div style="text-align: right; margin-top: 8px;">
+            <el-button size="mini" type="text" @click="deleteVisible = false">取消</el-button>
+            <el-button size="mini" type="primary" @click="onDelete">确定</el-button>
+          </div>
+          <template #reference>
+            <el-button icon="el-icon-delete" size="mini" :disabled="!apis.length" style="margin-left: 10px;">删除</el-button>
+          </template>
+        </el-popover>
+      </div>
+      <el-table :data="tableData" @sort-change="sortChange" @selection-change="handleSelectionChange">
+        <el-table-column
+          type="selection"
+          width="55"
+        />
+        <el-table-column align="left" label="部门" min-width="150" prop="description"/>
+        <el-table-column align="left" label="考核类别" min-width="60" prop="ID"/>
+        <el-table-column align="left" label="权重（%）" min-width="150" prop="path"/>
+        <el-table-column align="left" label="考核项目" min-width="150" prop="apiGroup"/>
+        <el-table-column align="left" label="考核说明" min-width="150" prop="apiGroup"/>
+        <!-- <el-table-column align="left" label="创建时间" min-width="150" prop="method">
+          <template #default="scope">
+            <div>
+              {{ scope.row.method }} / {{ methodFiletr(scope.row.method) }}
+            </div>
+          </template>
+        </el-table-column> -->
+        
+        <el-table-column align="left" fixed="right" label="操作" width="200">
+          <template #default="scope">
+            <el-button
+              icon="el-icon-edit"
+              size="small"
+              type="text"
+              @click="editApi(scope.row)"
+            >编辑</el-button>
+            <el-button
+              icon="el-icon-delete"
+              size="small"
+              type="text"
+              @click="deleteApi(scope.row)"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <div class="gva-pagination">
+        <el-pagination
+          :current-page="page"
+          :page-size="pageSize"
+          :page-sizes="[10, 30, 50, 100]"
+          :total="total"
+          layout="total, sizes, prev, pager, next, jumper"
+          @current-change="handleCurrentChange"
+          @size-change="handleSizeChange"
+        />
+      </div>
+
+    </div>
+
+    <el-dialog v-model="dialogFormVisible" :before-close="closeDialog" :title="dialogTitle" width="20%">
+      
+      <el-form ref="apiForm" :model="form" :rules="rules" label-width="80px">
+        <el-form-item label="考核类别" prop="category">
+          <el-input v-model="form.category" autocomplete="off" />
+        </el-form-item>
+        <el-form-item label="部门" prop="department">
+          <el-select v-model="form.department" placeholder="请选择部门" style="width:100%">
+            <el-option value="1" label="a工段">煤焦分厂</el-option>
+            <el-option value="2" label="b工段">化产分厂</el-option>
+            <el-option value="2" label="b工段">甲醇分厂</el-option>
+            <el-option value="2" label="b工段">动力分厂</el-option>
+            <el-option value="2" label="b工段">生产部</el-option>
+            <el-option value="2" label="b工段">技术部</el-option>
+            <el-option value="2" label="b工段">质检中心</el-option>
+            <el-option value="2" label="b工段">安全部</el-option>
+            <el-option value="2" label="b工段">环保部</el-option>
+            <el-option value="2" label="b工段">营销部</el-option>
+            <el-option value="2" label="b工段">仓储中心</el-option>
+            <el-option value="2" label="b工段">物流中心</el-option>
+            <el-option value="2" label="b工段">人力资源部</el-option>
+            <el-option value="2" label="b工段">财务部</el-option>
+            <el-option value="2" label="b工段">综合办</el-option>
+            <el-option value="2" label="b工段">企管部</el-option>
+            <el-option value="2" label="b工段">保卫部</el-option>
+          </el-select>
+        </el-form-item>
+        <el-form-item label="考核项目" prop="apiGrprojectoup">
+          <el-input v-model="form.project" autocomplete="off" />
+        </el-form-item>
+        <el-form-item label="权重" prop="weights">
+         <el-input placeholder="请输入内容" v-model="form.weights">
+            <template #append>%</template>
+          </el-input>
+        </el-form-item>
+        <el-form-item label="考核说明" prop="instruction">
+          <el-input
+            v-model="form.instruction"
+            :rows="2"
+            type="textarea"
+            placeholder="请输入考核说明"
+          />
+          <!-- <el-input v-model="form.instruction" autocomplete="off" /> -->
+        </el-form-item>
+      </el-form>
+      <template #footer>
+        <div class="dialog-footer">
+          <el-button size="small" @click="closeDialog">取 消</el-button>
+          <el-button size="small" type="primary" @click="enterDialog">确 定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+// 获取列表内容封装在mixins内部  getTableData方法 初始化已封装完成 条件搜索时候 请把条件安好后台定制的结构体字段 放到 this.searchInfo 中即可实现条件搜索
+
+import {
+  getApiById,
+  getApiList,
+  createApi,
+  updateApi,
+  deleteApi,
+  deleteApisByIds
+} from '@/api/api'
+import infoList from '@/mixins/infoList'
+import { toSQLLine } from '@/utils/stringFun'
+import warningBar from '@/components/warningBar/warningBar.vue'
+const methodOptions = [
+  {
+    value: 'POST',
+    label: '创建',
+    type: 'success'
+  },
+  {
+    value: 'GET',
+    label: '查看',
+    type: ''
+  },
+  {
+    value: 'PUT',
+    label: '更新',
+    type: 'warning'
+  },
+  {
+    value: 'DELETE',
+    label: '删除',
+    type: 'danger'
+  }
+]
+
+export default {
+  name: 'Api',
+  components: {
+    warningBar
+  },
+  mixins: [infoList],
+  data() {
+    return {
+      deleteVisible: false,
+      listApi: getApiList,
+      dialogFormVisible: false,
+      dialogTitle: '新增',
+      apis: [],
+      form: {
+        path: '',
+        apiGroup: '',
+        method: '',
+        description: ''
+      },
+      methodOptions: methodOptions,
+      type: '',
+      rules: {
+        path: [{ required: true, message: '请输入api路径', trigger: 'blur' }],
+        apiGroup: [
+          { required: true, message: '请输入组名称', trigger: 'blur' }
+        ],
+        method: [
+          { required: true, message: '请选择请求方式', trigger: 'blur' }
+        ],
+        description: [
+          { required: true, message: '请输入api介绍', trigger: 'blur' }
+        ]
+      }
+    }
+  },
+  created() {
+    this.getTableData()
+  },
+  methods: {
+    methodFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.label}`
+    },
+    tagTypeFiletr(value) {
+      const target = methodOptions.filter(item => item.value === value)[0]
+      return target && `${target.type}`
+    },
+    //  选中api
+    handleSelectionChange(val) {
+      this.apis = val
+    },
+    async onDelete() {
+      const ids = this.apis.forEach(item => item.ID)
+      const res = await deleteApisByIds({ ids })
+      if (res.code === 0) {
+        this.$message({
+          type: 'success',
+          message: res.msg
+        })
+        if (this.tableData.length === ids.length && this.page > 1) {
+          this.page--
+        }
+        this.deleteVisible = false
+        this.getTableData()
+      }
+    },
+    // 排序
+    sortChange({ prop, order }) {
+      if (prop) {
+        this.searchInfo.orderKey = toSQLLine(prop)
+        this.searchInfo.desc = order === 'descending'
+      }
+      this.getTableData()
+    },
+    onReset() {
+      this.searchInfo = {}
+    },
+    // 条件搜索前端看此方法
+    onSubmit() {
+      this.page = 1
+      this.pageSize = 10
+      this.getTableData()
+    },
+    initForm() {
+      this.$refs.apiForm.resetFields()
+      this.form = {
+        path: '',
+        apiGroup: '',
+        method: '',
+        description: ''
+      }
+    },
+    closeDialog() {
+      this.initForm()
+      this.dialogFormVisible = false
+    },
+    openDialog(type) {
+      switch (type) {
+        case 'addApi':
+          this.dialogTitle = '新增'
+          break
+        case 'edit':
+          this.dialogTitle = '编辑'
+          break
+        default:
+          break
+      }
+      this.type = type
+      this.dialogFormVisible = true
+    },
+    async editApi(row) {
+      const res = await getApiById({ id: row.ID })
+      this.form = res.data.api
+      this.openDialog('edit')
+    },
+    async deleteApi(row) {
+      this.$confirm('此操作将永久删除所有角色下该api, 是否继续?', '提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        type: 'warning'
+      })
+        .then(async() => {
+          const res = await deleteApi(row)
+          if (res.code === 0) {
+            this.$message({
+              type: 'success',
+              message: '删除成功!'
+            })
+            if (this.tableData.length === 1 && this.page > 1) {
+              this.page--
+            }
+            this.getTableData()
+          }
+        })
+    },
+    async enterDialog() {
+      this.$refs.apiForm.validate(async valid => {
+        if (valid) {
+          switch (this.type) {
+            case 'addApi':
+              {
+                const res = await createApi(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '添加成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+
+              break
+            case 'edit':
+              {
+                const res = await updateApi(this.form)
+                if (res.code === 0) {
+                  this.$message({
+                    type: 'success',
+                    message: '编辑成功',
+                    showClose: true
+                  })
+                }
+                this.getTableData()
+                this.closeDialog()
+              }
+              break
+            default:
+              // eslint-disable-next-line no-lone-blocks
+              {
+                this.$message({
+                  type: 'error',
+                  message: '未知操作',
+                  showClose: true
+                })
+              }
+              break
+          }
+        }
+      })
+    }
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.button-box {
+  padding: 10px 20px;
+  .el-button {
+    float: right;
+  }
+}
+.warning {
+  color: #dc143c;
+}
+</style>

web/src/view/process/bpmn/LF.vue

@@ -0,0 +1,367 @@
+<template>
+  <div class="logic-flow-view">
+    <h3 class="demo-title">LogicFlow Vue demo</h3>
+    <!-- 辅助工具栏 -->
+    <Control 
+      class="demo-control"
+      v-if="lf"
+      :lf="lf"
+      @catData="$_catData"
+    ></Control>
+    <!-- 节点面板 -->
+    <NodePanel v-if="lf" :lf="lf" :nodeList="nodeList"></NodePanel>
+    <!-- 画布 -->
+    <div id="LF-view"></div>
+    <!-- 用户节点自定义操作面板 -->
+    <AddPanel
+      v-if="showAddPanel"
+      class="add-panel"
+      :style="addPanelStyle"
+      :lf="lf"
+      :nodeData="addClickNode"
+      @addNodeFinish="hideAddPanel"
+      >
+    </AddPanel>
+    <!-- 属性面板 -->
+    <el-drawer
+      title="设置节点属性"
+      :visible.sync="dialogVisible"
+      direction="rtl"
+      size="500px"
+      :before-close="closeDialog">
+      <PropertyDialog
+        v-if="dialogVisible"
+        :nodeData="clickNode"
+        :lf="lf"
+        @setPropertiesFinish="closeDialog"
+      ></PropertyDialog>
+    </el-drawer>
+    <!-- 数据查看面板 -->
+    <el-dialog
+      title="数据"
+      :visible.sync="dataVisible"
+      width="50%">
+      <DataDialog :graphData="graphData"></DataDialog>
+    </el-dialog>
+    <h4>更多示例：
+      <el-button type="text" @click="goto">BpmnElement & TurboAdpter</el-button>
+    </h4>
+    <el-drawer
+      title="我是标题"
+      :visible.sync="drawer"
+      :direction="rtl">
+      <span>我来啦!</span>
+    </el-drawer>
+  </div>
+</template>
+<script>
+import LogicFlow from '@logicflow/core'
+// const LogicFlow = window.LogicFlow
+import { Menu, Snapshot } from '@logicflow/extension'
+import '@logicflow/core/dist/style/index.css'
+import '@logicflow/extension/lib/style/index.css'
+import NodePanel from './LFComponents/NodePanel.vue'
+import AddPanel from './LFComponents/AddPanel.vue'
+import Control from './LFComponents/Control.vue'
+import PropertyDialog from './PropertySetting/PropertyDialog.vue'
+import DataDialog from './LFComponents/DataDialog.vue'
+import { nodeList } from './config'
+
+import registerStart from './registerNode/registerStart'
+import registerUser from './registerNode/registerUser'
+import registerEnd from './registerNode/registerEnd'
+import registerPush from './registerNode/registerPush'
+import registerDownload from './registerNode/registerDownload'
+import registerPolyline from './registerNode/registerPolyline'
+import registerTask from './registerNode/registerTask'
+// import registerConnect from './registerNode/registerConnect'
+// import {
+//   registerStart,
+//   registerUser,
+//   registerEnd,
+//   registerPush,
+//   registerDownload,
+//   registerPolyline,
+//   registerTask,
+//   registerConnect,
+// } from './registerNode'
+const demoData = import.meta.glob('./data.json')
+
+export default {
+  name: 'LF',
+  components: { NodePanel, AddPanel, Control, PropertyDialog, DataDialog },
+  data () {
+    return {
+      drawer: false,
+      lf: null,
+      showAddPanel: false,
+      addPanelStyle: {
+        top: 0,
+        left: 0
+      },
+      nodeData: null,
+      addClickNode: null,
+      clickNode: null,
+      dialogVisible: false,
+      graphData: null,
+      dataVisible: false,
+      config: {
+        background: {
+          color: '#f7f9ff'
+        },
+        grid: {
+          size: 10,
+          visible: false
+        },
+        keyboard: {
+          enabled: true
+        },
+        style: {
+          rect: {
+            radius: 6,
+          },
+          edgeText: { // 边文本样式
+            background: {
+              fill: '#fff'
+            }
+          },
+        },
+        edgeTextDraggable: true,
+        guards: {
+          beforeClone (data) {
+            console.log('beforeClone', data)
+            return true
+          },
+          beforeDelete (data) {
+            // 可以根据data数据判断是否允许删除，允许返回true,不允许返回false
+            // 文档： http://logic-flow.org/guide/basic/keyboard.html#%E5%A6%82%E4%BD%95%E9%98%BB%E6%AD%A2%E5%88%A0%E9%99%A4%E6%88%96%E8%80%85%E6%8B%B7%E8%B4%9D%E8%A1%8C%E4%B8%BA
+            console.log('beforeDelete', data)
+            // _this.$message('不允许删除', 'error')
+            return true
+          }
+        }
+      },
+      moveData: {},
+      nodeList,
+    }
+  },
+  mounted () {
+    this.$_initLf()
+  },
+  methods: {
+    $_initLf () {
+      // 画布配置
+      
+      // 使用插件
+      LogicFlow.use(Menu)
+      LogicFlow.use(Snapshot)
+      const lf = new LogicFlow({...this.config, container: document.querySelector('#LF-view'),})
+      this.lf = lf
+      // lf.setDefaultEdgeType('bpmn:sequenceFlow');
+      // 菜单配置文档：http://logic-flow.org/guide/extension/extension-components.html#%E8%8F%9C%E5%8D%95
+      // 重置，增加，节点自由配置(以user节点为示例)
+      // lf.setMenuConfig({
+      //   nodeMenu: [],
+      //   edgeMenu: []
+      // })
+      // lf.addMenuConfig({
+      //   nodeMenu: [
+      //     {
+      //       text: '分享',
+      //       callback () {
+      //         alert('分享成功！')
+      //       }
+      //     },
+      //     {
+      //       text: '属性',
+      //       callback (node) {
+      //         alert(`
+      //           节点id：${node.id}
+      //           节点类型：${node.type}
+      //           节点坐标：(x: ${node.x}, y: ${node.y})`
+      //         )
+      //       }
+      //     }
+      //   ],
+      //   edgeMenu: [
+      //     {
+      //       text: '属性',
+      //       callback (edge) {
+      //         alert(`
+      //           边id：${edge.id}
+      //           边类型：${edge.type}
+      //           边坐标：(x: ${edge.x}, y: ${edge.y})
+      //           源节点id：${edge.sourceNodeId}
+      //           目标节点id：${edge.targetNodeId}`
+      //         )
+      //       }
+      //     }
+      //   ]
+      // })
+      // 设置主题
+      lf.setTheme({
+        circle: {
+          r: 20,
+          stroke: '#000000',
+          outlineColor: '#88f',
+          strokeWidth: 1
+        },
+        rect: {
+          outlineColor: '#88f',
+          strokeWidth: 1
+        },
+        polygon: {
+          strokeWidth: 1
+        },
+        polyline: {
+          stroke: '#000000',
+          hoverStroke: '#000000',
+          selectedStroke: '#000000',
+          outlineColor: '#88f',
+          strokeWidth: 1
+        },
+        nodeText: {
+          color: '#000000'
+        },
+        edgeText: {
+          color: '#000000',
+          background: {
+            fill: '#f7f9ff'
+          }
+        }
+      })
+      this.$_registerNode()
+    },
+    // 自定义
+    $_registerNode () {
+      registerStart(this.lf)
+      registerUser(this.lf)
+      registerEnd(this.lf)
+      registerPush(this.lf, this.clickPlus, this.mouseDownPlus)
+      registerDownload(this.lf)
+      registerPolyline(this.lf)
+      registerTask(this.lf)
+      // registerConnect(this.lf)
+      this.$_render()
+    },
+    $_render () {
+      this.lf.render(demoData)
+      this.$_LfEvent()
+    },
+    $_getData () {
+      const data = this.lf.getGraphData()
+      console.log(JSON.stringify(data))
+    },
+    $_LfEvent () {
+      
+      this.lf.on('node:click', ({data}) => {
+        
+        console.log(data)
+        this.$data.clickNode = data
+        // console.log(this.$data.clickNode)
+        // console.log(this.$data.dialogVisible)
+        this.dialogVisible = true
+        
+        this.$data.drawer=false
+        console.log(this.$data.drawer)
+      })
+      this.lf.on('edge:click', ({data}) => {
+        console.log('edge:click', data)
+         this.$data.clickNode = data
+          this.$data.dialogVisible = true
+      })
+      this.lf.on('element:click', () => {
+        this.hideAddPanel()
+      })
+      this.lf.on('edge:add', ({data}) => {
+        console.log('edge:add', data)
+      })
+      this.lf.on('node:mousemove', ({data}) => {
+        console.log('node:mousemove')
+        this.moveData = data
+      })
+      this.lf.on('blank:click', () => {
+        this.hideAddPanel()
+      })
+      this.lf.on('connection:not-allowed', (data) => {
+        this.$message({
+          type: 'error',
+          message: data.msg
+        })
+      })
+      this.lf.on('node:mousemove', () => {
+        console.log('on mousemove')
+      })
+    },
+    clickPlus (e, attributes) {
+      e.stopPropagation()
+      console.log('clickPlus', e, attributes)
+      const { clientX, clientY } = e
+      console.log(clientX, clientY)
+      this.$data.addPanelStyle.top = (clientY - 40) + 'px'
+      this.$data.addPanelStyle.left = clientX + 'px'
+      this.$data.showAddPanel = true
+      this.$data.addClickNode = attributes
+    },
+    mouseDownPlus (e, attributes) {
+      e.stopPropagation()
+      console.log('mouseDownPlus', e, attributes)
+    },
+    hideAddPanel () {
+      this.$data.showAddPanel = false
+      this.$data.addPanelStyle.top = 0
+      this.$data.addPanelStyle.left = 0
+      this.$data.addClickNode = null
+    },
+    closeDialog () {
+      this.$data.dialogVisible = false
+    },
+    $_catData(){
+      console.log()
+      this.$data.graphData = this.$data.lf.getGraphData();
+      this.$data.dataVisible = true;
+    },
+    goto () {
+      this.$router.push('/TurboAdpter')
+    }
+  }
+}
+</script>
+<style>
+.logic-flow-view {
+  height: 100vh;
+  position: relative;
+}
+.demo-title{
+  text-align: center;
+  margin: 20px;
+}
+.demo-control{
+  position: absolute;
+  top: 50px;
+  right: 50px;
+  z-index: 2;
+}
+#LF-view{
+  width: calc(100% - 100px);
+  height: 80%;
+  outline: none;
+  margin-left: 50px;
+}
+.time-plus{
+  cursor: pointer;
+}
+.add-panel {
+  position: absolute;
+  z-index: 11;
+  background-color: white;
+  padding: 10px 5px;
+}
+.el-drawer__body {
+  height: 80%;
+  overflow: auto;
+  margin-top: -30px;
+  z-index: 3;
+}
+</style>
+

web/src/view/process/bpmn/LFComponents/AddPanel.vue

@@ -0,0 +1,108 @@
+<template>
+  <el-tabs tab-position="left">
+    <el-tab-pane label="添加动作">
+      <div v-for="item in nodeList" :key="item.type">
+        <el-button class="add-node-btn" type="primary" size="mini" @click="$_addNode(item)">{{item.label}}</el-button>
+      </div>
+    </el-tab-pane>
+    <el-tab-pane label="添加组">
+      <el-button class="add-node-btn" type="primary" size="mini" @click="$_addTempalte">模板</el-button>
+    </el-tab-pane>
+  </el-tabs>
+</template>
+<script>
+export default {
+  name: 'AddPanel',
+  props: {
+    nodeData: Object,
+    lf: Object || String
+  },
+  data () {
+    return {
+      nodeList: [
+        {
+          type: 'user',
+          label: '用户'
+        },
+        {
+          type: 'push',
+          label: '推送'
+        }
+      ]
+    }
+  },
+  methods: {
+    $_addNode (item) {
+      const {lf, nodeData} = this.$props
+      const { id, x, y } = nodeData
+      const nextNode = lf.addNode({
+        type: item.type,
+        x: x + 150,
+        y: y + 150
+      })
+      const nextId = nextNode.id
+      lf.createEdge({sourceNodeId: id, targetNodeId: nextId})
+      this.$emit('addNodeFinish')
+    },
+    $_addTempalte () {
+      const {lf, nodeData} = this.$props
+      const { id, x, y } = nodeData
+      const timeNode = lf.addNode({
+        type: 'download',
+        x,
+        y: y + 150
+      })
+      const userNode = lf.addNode({
+        type: 'user',
+        x: x + 150,
+        y: y + 150
+      })
+      const pushNode = lf.addNode({
+        type: 'push',
+        x: x + 150,
+        y: y + 300,
+        properties: {}
+      })
+      const endNode = lf.addNode({
+        type: 'end',
+        x: x + 300,
+        y: y + 150
+      })
+      const endNode2 = lf.addNode({
+        type: 'end',
+        x: x + 300,
+        y: y + 300
+      })
+      lf.createEdge({sourceNodeId: id, targetNodeId: timeNode.id})
+      lf.createEdge({sourceNodeId: timeNode.id, targetNodeId: userNode.id})
+      lf.createEdge({
+        sourceNodeId: userNode.id,
+        targetNodeId: endNode.id,
+        endPoint: {x: x + 280, y: y + 150},
+        text: {
+          value: 'Y',
+          x: x + 230,
+          y: y + 140
+        }
+      })
+      lf.createEdge({
+        sourceNodeId: userNode.id,
+        targetNodeId: pushNode.id,
+        text: {
+          value: 'N',
+          x: x + 160,
+          y: y + 230
+        }
+      })
+      lf.createEdge({sourceNodeId: pushNode.id, targetNodeId: endNode2.id, endPoint: {x: x + 280, y: y + 300}})
+      this.$emit('addNodeFinish')
+    }
+  }
+}
+</script>
+<style scoped>
+.add-node-btn{
+  margin-bottom: 10px;
+  margin-right: 20px;
+}
+</style>

web/src/view/process/bpmn/LFComponents/Control.vue

@@ -0,0 +1,74 @@
+<template>
+  <div>
+     <el-button-group>
+      <el-button type="plain" size="small" @click="$_zoomIn">放大</el-button>
+      <el-button type="plain" size="small" @click="$_zoomOut">缩小</el-button>
+      <el-button type="plain" size="small" @click="$_zoomReset">大小适应</el-button>
+      <el-button type="plain" size="small" @click="$_translateRest">定位还原</el-button>
+      <el-button type="plain" size="small" @click="$_reset">还原(大小&定位)</el-button>
+      <el-button type="plain" size="small" @click="$_undo" :disabled="undoDisable">上一步(ctrl+z)</el-button>
+      <el-button type="plain" size="small" @click="$_redo" :disabled="redoDisable">下一步(ctrl+y)</el-button>
+      <el-button type="plain" size="small" @click="$_download">下载图片</el-button>
+      <el-button type="plain" size="small" @click="$_catData">查看数据</el-button>
+      <el-button v-if="catTurboData" type="plain" size="small" @click="$_catTurboData">查看turbo数据</el-button>
+    </el-button-group>
+  </div>
+</template>
+<script>
+export default {
+  name: 'Control',
+  props: {
+    lf: Object || String,
+    catTurboData: Boolean
+  },
+  data () {
+    return {
+      undoDisable: true,
+      redoDisable: true,
+      graphData: null,
+      dataVisible: false,
+    }
+  },
+  mounted () {
+    this.$props.lf.on('history:change', ({ data: { undoAble, redoAble } }) => {
+      this.$data.undoDisable = !undoAble
+      this.$data.redoDisable = !redoAble
+    });
+  },
+  methods: {
+    $_zoomIn(){
+      this.$props.lf.zoom(true);
+    },
+    $_zoomOut(){
+      this.$props.lf.zoom(false);
+    },
+    $_zoomReset(){
+      this.$props.lf.resetZoom();
+    },
+    $_translateRest(){
+      this.$props.lf.resetTranslate();
+    },
+    $_reset(){
+      this.$props.lf.resetZoom();
+      this.$props.lf.resetTranslate();
+    },
+    $_undo(){
+      this.$props.lf.undo();
+    },
+    $_redo(){
+      this.$props.lf.redo();
+    },
+    $_download(){
+      this.$props.lf.getSnapshot();
+    },
+    $_catData(){
+      this.$emit('catData');
+    },
+    $_catTurboData(){
+      this.$emit('catTurboData');
+    }
+  }
+}
+</script>
+<style scoped>
+</style>

web/src/view/process/bpmn/LFComponents/DataDialog.vue

@@ -0,0 +1,20 @@
+<template>
+  <div>
+    <vue-json-pretty :path="'res'" :data="graphData"> </vue-json-pretty>
+  </div>
+</template>
+<script>
+import VueJsonPretty from 'vue-json-pretty';
+import 'vue-json-pretty/lib/styles.css';
+
+export default {
+  props: {
+    graphData: Object
+  },
+  components: {
+    VueJsonPretty,
+  },
+};
+</script>
+<style scoped>
+</style>

web/src/view/process/bpmn/LFComponents/NodePanel.vue

@@ -0,0 +1,104 @@
+<template>
+  <div class="node-panel">
+    <div class="node-item"
+      v-for="item in nodeList"
+      :key="item.text"
+      @mousedown="$_dragNode(item)">
+    <div class="node-item-icon" :class="item.class">
+      <div v-if="item.type === 'user' || item.type === 'time'" class="shape"></div>
+    </div>
+    <span class="node-label">{{item.text}}</span>
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  name: 'NodePanel',
+  props: {
+    lf: Object,
+    nodeList: Array,
+  },
+  methods: {
+    $_dragNode (item) {
+      this.$props.lf.dnd.startDrag({
+        type: item.type,
+      })
+    }
+  }
+}
+</script>
+<style>
+.node-panel {
+  position: absolute;
+  top: 100px;
+  left: 50px;
+  width: 70px;
+  padding: 20px 10px;
+  background-color: white;
+  box-shadow: 0 0 10px 1px rgb(228, 224, 219);
+  border-radius: 6px;
+  text-align: center;
+  z-index: 101;
+}
+.node-item {
+  margin-bottom: 20px;
+}
+.node-item-icon {
+  width: 30px;
+  height: 30px;
+  margin-left: 20px;
+  background-size: cover;
+}
+.node-label {
+  font-size: 12px;
+  margin-top: 5px;
+  user-select: none;
+}
+.node-start{
+  background: url('../background/start.png') no-repeat;
+  background-size: cover;
+}
+.node-rect{
+  border: 1px solid black;
+}
+.node-user{
+  background: url('../background/user.png') no-repeat;
+  background-size: cover;
+}
+.node-time{
+  background: url('../background/time.png') no-repeat;
+  background-size: cover;
+}
+.node-push{
+  background: url('../background/push.png') no-repeat;
+  background-size: cover;
+}
+.node-download{
+  background: url('../background/download.png') no-repeat;
+  background-size: cover;
+}
+.node-click{
+  background: url('../background/click.png') no-repeat;
+  background-size: cover;
+}
+.node-end{
+  background: url('../background/end.png') no-repeat;
+  background-size: cover;
+}
+.bpmn-start {
+  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAAH6ji2bAAAABGdBTUEAALGPC/xhBQAAAnBJREFUOBGdVL1rU1EcPfdGBddmaZLiEhdx1MHZQXApraCzQ7GKLgoRBxMfcRELuihWKcXFRcEWF8HBf0DdDCKYRZpnl7p0svLe9Zzbd29eQhTbC8nv+9zf130AT63jvooOGS8Vf9Nt5zxba7sXQwODfkWpkbjTQfCGUd9gIp3uuPP8bZ946g56dYQvnBg+b1HB8VIQmMFrazKcKSvFW2dQTxJnJdQ77urmXWOMBCmXM2Rke4S7UAW+/8ywwFoewmBps2tu7mbTdp8VMOkIRAkKfrVawalJTtIliclFbaOBqa0M2xImHeVIfd/nKAfVq/LGnPss5Kh00VEdSzfwnBXPUpmykNss4lUI9C1ga+8PNrBD5YeqRY2Zz8PhjooIbfJXjowvQJBqkmEkVnktWhwu2SM7SMx7Cj0N9IC0oQXRo8xwAGzQms+xrB/nNSUWVveI48ayrFGyC2+E2C+aWrZHXvOuz+CiV6iycWe1Rd1Q6+QUG07nb5SbPrL4426d+9E1axKjY3AoRrlEeSQo2Eu0T6BWAAr6COhTcWjRaYfKG5csnvytvUr/WY4rrPMB53Uo7jZRjXaG6/CFfNMaXEu75nG47X+oepU7PKJvvzGDY1YLSKHJrK7vFUwXKkaxwhCW3u+sDFMVrIju54RYYbFKpALZAo7sB6wcKyyrd+aBMryMT2gPyD6GsQoRFkGHr14TthZni9ck0z+Pnmee460mHXbRAypKNy3nuMdrWgVKj8YVV8E7PSzp1BZ9SJnJAsXdryw/h5ctboUVi4AFiCd+lQaYMw5z3LGTBKjLQOeUF35k89f58Vv/tGh+l+PE/wG0rgfIUbZK5AAAAABJRU5ErkJggg==) center center no-repeat;
+  cursor: grab;
+}
+.bpmn-end {
+  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAAH6ji2bAAAABGdBTUEAALGPC/xhBQAAA1BJREFUOBFtVE1IVUEYPXOf+tq40Y3vPcmFIdSjIorWoRG0ERWUgnb5FwVhYQSl72oUoZAboxKNFtWiwKRN0M+jpfSzqJAQclHo001tKkjl3emc8V69igP3znzfnO/M9zcDcKT67azmjYWTwl9Vn7Vumeqzj1DVb6cleQY4oAVnIOPb+mKAGxQmKI5CWNJ2aLPatxWa3aB9K7/fB+/Z0jUF6TmMlFLQqrkECWQzOZxYGjTlOl8eeKaIY5yHnFn486xBustDjWT6dG7pmjHOJd+33t0iitTPkK6tEvjxq4h2MozQ6WFSX/LkDUGfFwfhEZj1Auz/U4pyAi5Sznd7uKzznXeVHlI/Aywmk6j7fsUsEuCGADrWARXXwjxWQsUbIupDHJI7kF5dRktg0eN81IbiZXiTESic50iwS+t1oJgL83jAiBupLDCQqwziaWSoAFSeIR3P5Xv5az00wyIn35QRYTwdSYbz8pH8fxUUAtxnFvYmEmgI0wYXUXcCCSpeEVpXlsRhBnCEATxWylL9+EKCAYhe1NGstUa6356kS9NVvt3DU2fd+Wtbm/+lSbylJqsqkSm9CRhvoJVlvKPvF1RKY/FcPn5j4UfIMLn8D4UYb54BNsilTDXKnF4CfTobA0FpoW/LSp306wkXM+XaOJhZaFkcNM82ASNAWMrhrUbRfmyeI1FvRBTpN06WKxa9BK0o2E4Pd3zfBBEwPsv9sQBnmLVbLEIZ/Xe9LYwJu/Er17W6HYVBc7vmuk0xUQ+pqxdom5Fnp55SiytXLPYoMXNM4u4SNSCFWnrVIzKG3EGyMXo6n/BQOe+bX3FClY4PwydVhthOZ9NnS+ntiLh0fxtlUJHAuGaFoVmttpVMeum0p3WEXbcll94l1wM/gZ0Ccczop77VvN2I7TlsZCsuXf1WHvWEhjO8DPtyOVg2/mvK9QqboEth+7pD6NUQC1HN/TwvydGBARi9MZSzLE4b8Ru3XhX2PBxf8E1er2A6516o0w4sIA+lwURhAON82Kwe2iDAC1Watq4XHaGQ7skLcFOtI5lDxuM2gZe6WFIotPAhbaeYlU4to5cuarF1QrcZ/lwrLaCJl66JBocYZnrNlvm2+MBCTmUymPrYZVbjdlr/BxlMjmNmNI3SAAAAAElFTkSuQmCC) center center no-repeat;
+  cursor: grab;
+}
+.bpmn-user {
+  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAEFVwZaAAAABGdBTUEAALGPC/xhBQAAAqlJREFUOBF9VM9rE0EUfrMJNUKLihGbpLGtaCOIR8VjQMGDePCgCCIiCNqzCAp2MyYUCXhUtF5E0D+g1t48qAd7CCLqQUQKEWkStcEfVGlLdp/fm3aW2QQdyLzf33zz5m2IsAZ9XhDpyaaIZkTS4ASzK41TFao88GuJ3hsr2pAbipHxuSYyKRugagICGANkfFnNh3HeE2N0b3nN2cgnpcictw5veJIzxmDamSlxxQZicq/mflxhbaH8BLRbuRwNtZp0JAhoplVRUdzmCe/vO27wFuuA3S5qXruGdboy5/PRGFsbFGKo/haRtQHIrM83bVeTrOgNhZReWaYGnE4aUQgTJNvijJFF4jQ8BxJE5xfKatZWmZcTQ+BVgh7s8SgPlCkcec4mGTmieTP4xd7PcpIEg1TX6gdeLW8rTVMVLVvb7ctXoH0Cydl2QOPJBG21STE5OsnbweVYzAnD3A7PVILuY0yiiyDwSm2g441r6rMSgp6iK42yqroI2QoXeJVeA+YeZSa47gZdXaZWQKTrG93rukk/l2Al6Kzh5AZEl7dDQy+JjgFahQjRopSxPbrbvK7GRe9ePWBo1wcU7sYrFZtavXALwGw/7Dnc50urrHJuTPSoO2IMV3gUQGNg87IbSOIY9BpiT9HV7FCZ94nPXb3MSnwHn/FFFE1vG6DTby+r31KAkUktB3Qf6ikUPWxW1BkXSPQeMHHiW0+HAd2GelJsZz1OJegCxqzl+CLVHa/IibuHeJ1HAKzhuDR+ymNaRFM+4jU6UWKXorRmbyqkq/D76FffevwdCp+jN3UAN/C9JRVTDuOxC/oh+EdMnqIOrlYteKSfadVRGLJFJPSB/ti/6K8f0CNymg/iH2gO/f0DwE0yjAFO6l8JaR5j0VPwPwfaYHqOqrCI319WzwhwzNW/aQAAAABJRU5ErkJggg==) center center no-repeat;
+  cursor: grab;
+}
+.bpmn-exclusiveGateway {
+  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAVCAYAAAHeEJUAAAAABGdBTUEAALGPC/xhBQAAAvVJREFUOBGNVEFrE0EU/mY3bQoiFlOkaUJrQUQoWMGePLX24EH0IIoHKQiCV0G8iE1covgLiqA/QTzVm1JPogc9tIJYFaQtlhQxqYjSpunu+L7JvmUTU3AgmTfvffPNN++9WSA1DO182f6xwILzD5btfAoQmwL5KJEwiQyVbSVZ0IgRyV6PTpIJ81E5ZvqfHQR0HUOBHW4L5Et2kQ6Zf7iAOhTFAA8s0pEP7AXO1uAA52SbqGk6h/6J45LaLhO64ByfcUzM39V7ZiAdS2yCePPEIQYvTUHqM/n7dgQNfBKWPjpF4ISk8q3J4nB11qw6X8l+FsF3EhlkEMfrjIer3wJTLwS2aCNcj4DbGxXTw00JmAuO+Ni6bBxVUCvS5d9aa04+so4pHW5jLTywuXAL7jJ+D06sl82Sgl2JuVBQn498zkc2bGKxULHjCnSMadBKYDYYHAtsby1EQ5lNGrQd4Y3v4Zo0XdGEmDno46yCM9Tk+RiJmUYHS/aXHPNTcjxcbTFna000PFJHIVZ5lFRqRpJWk9/+QtlOUYJj9HG5pVFEU7zqIYDVsw2s+AJaD8wTd2umgSCCyUxgGsS1Y6TBwXQQTFuZaHcd8gAGioE90hlsY+wMcs30RduYtxanjMGal8H5dMW67dmT1JFtYUEe8LiQLRsPZ6IIc7A4J5tqco3T0pnv/4u0kyzrYUq7gASuEyI8VXKvB9Odytv6jS/PNaZBln0nioJG/AVQRZvApOdhjj3Jt8QC8Im09SafwdBdvIpztpxWxpeKCC+EsFdS8DCyuCn2munFpL7ctHKp+Xc5cMybeIyMAN33SPL3ZR9QV1XVwLyzHm6Iv0/yeUuUb7PPlZC4D4HZkeu6dpF4v9j9MreGtMbxMMRLIcjJic9yHi7WQ3yVKzZVWUr5UrViJvn1FfUlwe/KYVfYyWRLSGNu16hR01U9IacajXPei0wx/5BqgInvJN+MMNtNme7ReU9SBbgntovn0kKHpFg7UogZvaZiOue/q1SBo9ktHzQAAAAASUVORK5CYII=) center center no-repeat;
+  cursor: grab;
+}
+</style>

web/src/view/process/bpmn/PropertySetting/CommonProperty.vue

@@ -0,0 +1,74 @@
+<template>
+  <div>
+    <el-form label-width="80px" :model="formData">
+      <el-form-item label="文案">
+        <el-input v-model="formData.text"></el-input>
+      </el-form-item>
+      <el-form-item label="名称">
+        <el-input v-model="formData.name"></el-input>
+      </el-form-item>
+      <el-form-item label="活动区域">
+        <el-input v-model="formData.region"></el-input>
+      </el-form-item>
+      <el-form-item label="活动形式">
+        <el-input v-model="formData.type"></el-input>
+      </el-form-item>
+      <el-form-item label="A">
+        <el-input v-model="formData.a.a1"></el-input>
+        <el-input v-model="formData.a.a2"></el-input>
+      </el-form-item>
+       <el-form-item>
+        <el-button type="primary" @click="onSubmit">保存</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+<script>
+export default {
+  name: '',
+  props: {
+    nodeData: Object,
+    lf: Object || String,
+  },
+  mounted() {
+    const { properties, text } = this.$props.nodeData
+    if (properties) {
+      this.$data.formData = Object.assign({}, this.$data.formData, properties)
+    }
+    if (text && text.value) {
+      this.$data.formData.text = text.value
+    }
+    if (text && text.value) {
+      this.$data.text = text.value
+    }
+  },
+  data () {
+    return {
+      text: '',
+      formData: {
+          text: '',
+          name: '',
+          region: '',
+          type: '',
+          a: {
+            a1: '',
+            a2: ''
+          }
+        }
+    }
+  }, 
+  methods: {
+    onSubmit() {
+      const { id } = this.$props.nodeData
+      this.$props.lf.setProperties(id, {
+        ...this.$data.formData
+      });
+      console.log(6666, this.$data.formData);
+      this.$props.lf.updateText(id, this.$data.formData.text);
+      this.$emit('onClose')
+    },
+  }
+}
+</script>
+<style scoped>
+</style>

web/src/view/process/bpmn/PropertySetting/PropertyDialog.vue

@@ -0,0 +1,43 @@
+<template>
+  <div class="property-dialog">
+    <User
+      v-if="nodeData.type === 'user'"
+      :nodeData="nodeData"
+      :lf="lf"
+      @onClose="handleClose"/>
+    <CommonProperty
+      v-else
+      :nodeData="nodeData"
+      :lf="lf"
+      @onClose="handleClose"/>
+  </div>
+</template>
+<script>
+import CommonProperty from './CommonProperty.vue'
+import User from './User.vue'
+
+export default {
+  name: 'PropertyDialog',
+  components: {
+    CommonProperty,
+    User
+  },
+  props: {
+    nodeData: Object,
+    lf: Object
+  },
+  data () {
+    return {}
+  },
+  methods: {
+    handleClose () {
+      this.$emit('setPropertiesFinish')
+    }
+  }
+}
+</script>
+<style>
+.property-dialog{
+  padding: 20px;
+}
+</style>

web/src/view/process/bpmn/PropertySetting/User.vue

@@ -0,0 +1,90 @@
+<template>
+  <div>
+    <el-form ref="form" :model="form" label-width="80px">
+      <el-form-item label="活动名称">
+        <el-input v-model="form.name"></el-input>
+      </el-form-item>
+      <el-form-item label="活动区域">
+        <el-select v-model="form.region" placeholder="请选择活动区域">
+          <el-option label="区域一" value="shanghai"></el-option>
+          <el-option label="区域二" value="beijing"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item label="活动时间">
+        <el-col :span="11">
+          <el-date-picker type="date" placeholder="选择日期" v-model="form.date1" style="width: 100%;"></el-date-picker>
+        </el-col>
+        <el-col class="line" :span="2">-</el-col>
+        <el-col :span="11">
+          <el-time-picker placeholder="选择时间" v-model="form.date2" style="width: 100%;"></el-time-picker>
+        </el-col>
+      </el-form-item>
+      <el-form-item label="即时配送">
+        <el-switch v-model="form.delivery"></el-switch>
+      </el-form-item>
+      <el-form-item label="活动性质">
+        <el-checkbox-group v-model="form.type">
+          <el-checkbox label="美食/餐厅线上活动" name="type"></el-checkbox>
+          <el-checkbox label="地推活动" name="type"></el-checkbox>
+          <el-checkbox label="线下主题活动" name="type"></el-checkbox>
+          <el-checkbox label="单纯品牌曝光" name="type"></el-checkbox>
+        </el-checkbox-group>
+      </el-form-item>
+      <el-form-item label="特殊资源">
+        <el-radio-group v-model="form.resource">
+          <el-radio label="线上品牌商赞助"></el-radio>
+          <el-radio label="线下场地免费"></el-radio>
+        </el-radio-group>
+      </el-form-item>
+      <el-form-item label="活动形式">
+        <el-input type="textarea" v-model="form.desc"></el-input>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="onSubmit">保存</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+<script>
+export default {
+  name: '',
+  props: {
+    nodeData: Object,
+    lf: Object || String,
+  },
+  mounted() {
+    const { properties } = this.$props.nodeData
+    if (properties) {
+      this.$data.form = Object.assign({}, this.$data.form, properties)
+    }
+  },
+  data() {
+    return {
+      form: {
+        name: '',
+        region: '',
+        date1: '',
+        date2: '',
+        delivery: false,
+        type: [],
+        resource: '',
+        desc: ''
+      }
+    }
+  },
+  methods: {
+    onSubmit() {
+      console.log('submit!');
+      // const { id } = this.$props.nodeData
+      // this.$props.lf.setProperties(id, this.$data.form);
+      const nodeData = this.$props.nodeData
+      nodeData.properties = this.$data.form
+      console.log(nodeData);
+      this.$props.lf.setNodeData(nodeData);
+      this.$emit('onClose')
+    }
+  }
+}
+</script>
+<style scoped>
+</style>

web/src/view/process/bpmn/Test.vue

@@ -0,0 +1,21 @@
+<template>
+  <div>
+    测试
+    <el-button @click="goto">流程</el-button>
+  </div>
+</template>
+<script>
+export default {
+  name: 'Test',
+  data () {
+    return {}
+  },
+  methods: {
+    goto () {
+      this.$router.push('/')
+    }
+  }
+}
+</script>
+<style scoped>
+</style>

web/src/view/process/bpmn/TurboAdpter.vue

@@ -0,0 +1,167 @@
+<template>
+  <div class="logic-flow-view">
+    <h3 class="demo-title">LogicFlow Turbo Adpter</h3>
+    <!-- 辅助工具栏 -->
+    <Control 
+      class="demo-control"
+      v-if="lf"
+      :lf="lf"
+      catTurboData=true
+      @catData="$_catData"
+      @catTurboData="$_catTurboData"
+    ></Control>
+    <!-- 节点面板 -->
+    <NodePanel :lf="lf" :nodeList="nodeList"></NodePanel>
+    <!-- 画布 -->
+    <div id="LF-Turbo"></div>
+    <!-- 数据查看面板 -->
+    <el-dialog
+      title="数据"
+      :visible.sync="dataVisible"
+      width="50%">
+      <DataDialog :graphData="graphData"></DataDialog>
+    </el-dialog>
+    <h4>更多示例：
+      <el-button type="text" @click="goto">LogicFlow</el-button>
+    </h4>
+  </div>
+</template>
+<script>
+import LogicFlow from '@logicflow/core'
+import { Snapshot, BpmnElement,BpmnAdapter } from '@logicflow/extension'
+import '@logicflow/core/dist/style/index.css'
+import '@logicflow/extension/lib/style/index.css'
+import NodePanel from './LFComponents/NodePanel.vue'
+import Control from './LFComponents/Control.vue'
+import DataDialog from './LFComponents/DataDialog.vue'
+import { toTurboData, toLogicflowData } from './Util/AdpterForTurbo';
+import { BpmnNode } from './config'
+const demoData = import.meta.glob('./dataTurbo.json')
+
+export default {
+  name: 'LF',
+   components: { NodePanel, Control, DataDialog },
+  data () {
+    return {
+      lf: null,
+      dialogVisible: false,
+      graphData: null,
+      dataVisible: false,
+      config: {
+        grid: true,
+        background: {
+          color: '#f7f9ff'
+        },
+        keyboard: {
+          enabled: true
+        },
+      },
+      nodeList: BpmnNode,
+    }
+  },
+  mounted () {
+    this.$_initLf()
+  },
+  methods: {
+    $_initLf () {
+      // 画布配置
+      LogicFlow.use(Snapshot)
+      // 使用bpmn插件，引入bpmn元素，这些元素可以在turbo中转换后使用
+      LogicFlow.use(BpmnElement)
+      const lf = new LogicFlow({...this.config, container: document.querySelector('#LF-Turbo')})
+      this.lf = lf
+      // 设置边类型bpmn:sequenceFlow为默认类型
+      lf.setDefaultEdgeType('bpmn:sequenceFlow')
+      this.$_render()
+    },
+    $_render () {
+      
+      // Turbo数据转换为LogicFlow内部识别的数据结构
+      const lFData = toLogicflowData(demoData)
+      
+      this.lf.render(lFData)
+      console.log("lFData")
+      console.log(lFData)
+    },
+    closeDialog () {
+      this.$data.dialogVisible = false
+    },
+    $_catData(){
+      LogicFlow.use(BpmnAdapter);
+
+        // 示例化 LogicFlow
+        const lf = new LogicFlow();
+        lf.render();
+
+        // 通过 getGraphData 来获取转换后的数据
+        this.$data.graphData =lf.getGraphData();
+        console.log(this.$data.graphData)
+      // console.log(this.$data.lf.getGraphRawData)
+      // this.$data.graphData = this.$data.lf.getGraphData();
+      // console.log(this.$data.graphData)
+      // this.$data.dataVisible = true;
+    },
+    $_catTurboData(){
+      const graphData = this.$data.lf.getGraphData();
+      // 数据转化为Turbo识别的数据结构
+      console.log("graphData")
+      console.log(graphData)
+      this.$data.graphData = toTurboData(graphData)
+      this.$data.dataVisible = true;
+      console.log("this.$data.graphData")
+      console.log(this.$data.graphData)
+    },
+    $_xml(){
+      LogicFlow.use(BpmnAdapter);
+
+        // 示例化 LogicFlow
+        const lf = new LogicFlow();
+        lf.render();
+
+        // 通过 getGraphData 来获取转换后的数据
+        lf.getGraphData();
+    },
+    goto () {
+      this.$router.push('/')
+    }
+  }
+}
+</script>
+<style>
+.logic-flow-view {
+  height: 100vh;
+  position: relative;
+}
+.demo-title{
+  text-align: center;
+  margin: 20px;
+}
+.demo-control{
+  position: absolute;
+  top: 50px;
+  right: 50px;
+  z-index: 2;
+}
+#LF-Turbo{
+  width: calc(100% - 100px);
+  height: 80%;
+  outline: none;
+  margin-left: 50px;
+}
+.time-plus{
+  cursor: pointer;
+}
+.add-panel {
+  position: absolute;
+  z-index: 11;
+  background-color: white;
+  padding: 10px 5px;
+}
+.el-drawer__body {
+  height: 80%;
+  overflow: auto;
+  margin-top: -30px;
+  z-index: 3;
+}
+</style>
+

web/src/view/process/bpmn/Util/AdpterForTurbo.js

@@ -0,0 +1,166 @@
+
+const TurboType = {
+  SEQUENCE_FLOW: 1,
+  START_EVENT : 2,
+  END_EVENT : 3,
+  USER_TASK: 4,
+  SERVICE_TASK : 5,
+  EXCLUSIVE_GATEWAY : 6,
+}
+
+function getTurboType (type) {
+  switch (type) {
+    case 'bpmn:sequenceFlow':
+      return TurboType.SEQUENCE_FLOW;
+    case 'bpmn:startEvent':
+      return TurboType.START_EVENT;
+    case 'bpmn:endEvent':
+      return TurboType.END_EVENT;
+    case 'bpmn:userTask':
+      return TurboType.USER_TASK;
+    case 'bpmn:serviceTask':
+      return TurboType.SERVICE_TASK;
+    case 'bpmn:exclusiveGateway':
+      return TurboType.EXCLUSIVE_GATEWAY;
+    default:
+      return type;
+  }
+}
+
+function convertNodeToTurboElement(node) {
+  const { id, type, x, y, text = '', properties } = node;
+  return {
+      incoming: [],
+      outgoing: [],
+      dockers: [],
+      type: getTurboType(node.type),
+      properties: {
+        ...properties,
+        name: text && text.value || '',
+        x: x,
+        y: y,
+        text,
+        logicFlowType: type,
+      },
+      key: id,
+    };
+}
+function convertEdgeToTurboElement (edge) {
+  const {
+    id,
+    type,
+    sourceNodeId,
+    targetNodeId,
+    startPoint,
+    endPoint,
+    pointsList,
+    text = '',
+    properties } = edge;
+  return {
+      incoming: [sourceNodeId],
+      outgoing: [targetNodeId],
+      type: getTurboType(type),
+      dockers: [],
+      properties: {
+        ...properties,
+        name: text && text.value || '',
+        text,
+        startPoint,
+        endPoint,
+        pointsList,
+        logicFlowType: type,
+      },
+      key: id,
+    };
+}
+
+export function toTurboData(data) {
+  const nodeMap = new Map();
+  const turboData = {
+    flowElementList: [],
+  };
+  data.nodes.forEach((node) => {
+    const flowElement = convertNodeToTurboElement(node);
+    turboData.flowElementList.push(flowElement);
+    nodeMap.set(node.id, flowElement);
+  });
+  data.edges.forEach((edge) => {
+    const flowElement = convertEdgeToTurboElement(edge);
+    const sourceElement = nodeMap.get(edge.sourceNodeId);
+    sourceElement.outgoing.push(flowElement.key);
+    const targetElement = nodeMap.get(edge.targetNodeId);
+    targetElement.incoming.push(flowElement.key);
+    turboData.flowElementList.push(flowElement);
+  });
+  return turboData;
+}
+
+
+function convertFlowElementToEdge(element) {
+  const { incoming, outgoing, properties, key } = element;
+  const {
+    text,
+    startPoint,
+    endPoint,
+    pointsList,
+    logicFlowType
+  } = properties;
+  const edge = {
+    id: key,
+    type: logicFlowType,
+    sourceNodeId: incoming[0],
+    targetNodeId: outgoing[0],
+    text,
+    startPoint,
+    endPoint,
+    pointsList,
+    properties: {}
+  };
+  const excludeProperties = ['startPoint', 'endPoint', 'pointsList', 'text', 'logicFlowType'];
+  Object.keys(element.properties).forEach(property => {
+    if (excludeProperties.indexOf(property) === -1) {
+      edge.properties[property] = element.properties[property];
+    }
+  });
+  return edge;
+}
+
+function convertFlowElementToNode(element) {
+  const { properties, key } = element;
+  const { x, y, text, logicFlowType } = properties;
+  const node = {
+    id: key,
+    type: logicFlowType,
+    x,
+    y,
+    text,
+    properties: {}
+  };
+  const excludeProperties = ['x', 'y', 'text', 'logicFlowType'];
+  Object.keys(element.properties).forEach(property => {
+    if (excludeProperties.indexOf(property) === -1) {
+      node.properties[property] = element.properties[property];
+    }
+  });
+  return node;
+
+}
+
+
+export function toLogicflowData(data) {
+  const lfData = {
+    nodes: [],
+    edges: [],
+  };
+  const list = data.flowElementList;
+  list && list.length > 0 && list.forEach(element => {
+    if (element.type === TurboType.SEQUENCE_FLOW) {
+      const edge = convertFlowElementToEdge(element);
+      lfData.edges.push(edge);
+    } else {
+      const node = convertFlowElementToNode(element);
+      lfData.nodes.push(node);
+    }
+  })
+  return lfData;
+}

web/src/view/process/bpmn/config.js

@@ -0,0 +1,60 @@
+export const nodeList = [
+  {
+    text: '开始',
+    type: 'start',
+    class: 'node-start'
+  },
+  {
+    text: '矩形',
+    type: 'rect',
+    class: 'node-rect'
+  },
+  {
+    type: 'user',
+    text: '用户',
+    class: 'node-user'
+  },
+  {
+    type: 'push',
+    text: '推送',
+    class: 'node-push'
+  },
+  {
+    type: 'download',
+    text: '位置',
+    class: 'node-download'
+  },
+  {
+    type: 'connect',
+    text: 'Html',
+    class: 'node-push'
+  },
+  {
+    type: 'end',
+    text: '结束',
+    class: 'node-end'
+  },
+];
+
+export const BpmnNode = [
+  {
+    type: 'bpmn:startEvent',
+    text: '开始',
+    class: 'bpmn-start'
+  },
+  {
+    type: 'bpmn:endEvent',
+    text: '结束',
+    class: 'bpmn-end'
+  },
+  {
+    type: 'bpmn:exclusiveGateway',
+    text: '网关',
+    class: 'bpmn-exclusiveGateway'
+  },
+  {
+    type: 'bpmn:userTask',
+    text: '用户',
+    class: 'bpmn-user'
+  },
+]

web/src/view/process/bpmn/data.json

@@ -0,0 +1,346 @@
+{
+  "nodes": [
+    {
+      "id": "742356ea-762b-4899-b96a-bd567e3c4361",
+      "type": "start",
+      "x": 220,
+      "y": 170,
+      "text": {
+        "x": 350,
+        "y": 190,
+        "value": "sdfasf"
+      },
+      "properties": {},
+      "baseType": "node"
+    },
+    {
+      "id": "dacda6b6-48d3-4dff-911d-287704eb23d8",
+      "type": "rect",
+      "x": 350,
+      "y": 170,
+      "properties": {},
+      "baseType": "node",
+      "text": {
+        "x": 350,
+        "y": 170,
+        "value": "基础节点"
+      }
+    },
+    {
+      "id": "49106603-2b88-4b2c-b1e8-723c1f2210bd",
+      "type": "user",
+      "x": 530,
+      "y": 170,
+      "properties": {},
+      "baseType": "node",
+      "text": {
+        "x": 530,
+        "y": 220,
+        "value": "自定义节点"
+      }
+    },
+    {
+      "id": "647fa2bc-98ee-40cf-99c5-4756c0bc130d",
+      "type": "push",
+      "x": 690,
+      "y": 170,
+      "properties": {},
+      "baseType": "node",
+      "text": {
+        "x": 690,
+        "y": 220,
+        "value": "自定义节点 可添加下一个节点/节点组"
+      }
+    },
+    {
+      "id": "37e7bac3-8804-4237-abe9-7b6065c207e9",
+      "type": "download",
+      "x": 690,
+      "y": 320,
+      "properties": {},
+      "baseType": "node"
+    },
+    {
+      "id": "6bb4396f-54c9-4b1c-b34c-87ef004f2e29",
+      "type": "user",
+      "x": 840,
+      "y": 320,
+      "properties": {},
+      "baseType": "node"
+    },
+    {
+      "id": "abf76937-63b8-493c-a978-a4a58bc4f6b8",
+      "type": "push",
+      "x": 840,
+      "y": 470,
+      "properties": {},
+      "baseType": "node"
+    },
+    {
+      "id": "b119f24f-2669-4a90-a837-afd853b2ffcc",
+      "type": "end",
+      "x": 990,
+      "y": 320,
+      "properties": {},
+      "baseType": "node"
+    },
+    {
+      "id": "60326ad9-cae2-4a85-ae98-d340fb7bd67f",
+      "type": "end",
+      "x": 990,
+      "y": 470,
+      "properties": {},
+      "baseType": "node"
+    },
+    {
+      "id": "414fe028-3609-4450-b0f4-e5aca7705e8c",
+      "type": "download",
+      "x": 860,
+      "y": 170,
+      "properties": {},
+      "baseType": "node",
+      "text": {
+        "x": 860,
+        "y": 220,
+        "value": "自定义节点-设置颜色"
+      }
+    }
+  ],
+  "edges": [
+    {
+      "id": "00f55245-513e-43a2-9cb0-adb61b01adc8",
+      "type": "polyline",
+      "sourceNodeId": "742356ea-762b-4899-b96a-bd567e3c4361",
+      "targetNodeId": "dacda6b6-48d3-4dff-911d-287704eb23d8",
+      "startPoint": {
+        "x": 240,
+        "y": 170
+      },
+      "endPoint": {
+        "x": 300,
+        "y": 170
+      },
+      "properties": {},
+      "pointsList": [
+        {
+          "x": 240,
+          "y": 170
+        },
+        {
+          "x": 300,
+          "y": 170
+        }
+      ]
+    },
+    {
+      "id": "bbf9754f-603e-48e4-85fe-84ed44459a6a",
+      "type": "polyline",
+      "sourceNodeId": "dacda6b6-48d3-4dff-911d-287704eb23d8",
+      "targetNodeId": "49106603-2b88-4b2c-b1e8-723c1f2210bd",
+      "startPoint": {
+        "x": 400,
+        "y": 170
+      },
+      "endPoint": {
+        "x": 495,
+        "y": 170
+      },
+      "properties": {},
+      "pointsList": [
+        {
+          "x": 400,
+          "y": 170
+        },
+        {
+          "x": 495,
+          "y": 170
+        }
+      ]
+    },
+    {
+      "id": "12bb443b-4070-4a08-ad4d-2755ee856f0d",
+      "type": "polyline",
+      "sourceNodeId": "49106603-2b88-4b2c-b1e8-723c1f2210bd",
+      "targetNodeId": "647fa2bc-98ee-40cf-99c5-4756c0bc130d",
+      "startPoint": {
+        "x": 565,
+        "y": 170
+      },
+      "endPoint": {
+        "x": 655,
+        "y": 170
+      },
+      "properties": {},
+      "pointsList": [
+        {
+          "x": 565,
+          "y": 170
+        },
+        {
+          "x": 655,
+          "y": 170
+        }
+      ]
+    },
+    {
+      "id": "33fa3c09-9c29-4cb7-8373-67d537b8b623",
+      "type": "polyline",
+      "sourceNodeId": "647fa2bc-98ee-40cf-99c5-4756c0bc130d",
+      "targetNodeId": "37e7bac3-8804-4237-abe9-7b6065c207e9",
+      "startPoint": {
+        "x": 690,
+        "y": 205
+      },
+      "endPoint": {
+        "x": 690,
+        "y": 295
+      },
+      "properties": {},
+      "pointsList": [
+        {
+          "x": 690,
+          "y": 205
+        },
+        {
+          "x": 690,
+          "y": 295
+        }
+      ]
+    },
+    {
+      "id": "2b5a5e89-005e-4fda-9a44-dc795050534f",
+      "type": "polyline",
+      "sourceNodeId": "37e7bac3-8804-4237-abe9-7b6065c207e9",
+      "targetNodeId": "6bb4396f-54c9-4b1c-b34c-87ef004f2e29",
+      "startPoint": {
+        "x": 715,
+        "y": 320
+      },
+      "endPoint": {
+        "x": 805,
+        "y": 320
+      },
+      "properties": {},
+      "pointsList": [
+        {
+          "x": 715,
+          "y": 320
+        },
+        {
+          "x": 805,
+          "y": 320
+        }
+      ]
+    },
+    {
+      "id": "62b54f8a-bcfd-494b-9144-5aeb09ca77a1",
+      "type": "polyline",
+      "sourceNodeId": "6bb4396f-54c9-4b1c-b34c-87ef004f2e29",
+      "targetNodeId": "b119f24f-2669-4a90-a837-afd853b2ffcc",
+      "startPoint": {
+        "x": 875,
+        "y": 320
+      },
+      "endPoint": {
+        "x": 970,
+        "y": 320
+      },
+      "properties": {},
+      "text": {
+        "x": 920,
+        "y": 310,
+        "value": "Y"
+      },
+      "pointsList": [
+        {
+          "x": 875,
+          "y": 320
+        },
+        {
+          "x": 970,
+          "y": 320
+        }
+      ]
+    },
+    {
+      "id": "ba816d4a-5785-4911-9f78-03933f1463a1",
+      "type": "polyline",
+      "sourceNodeId": "6bb4396f-54c9-4b1c-b34c-87ef004f2e29",
+      "targetNodeId": "abf76937-63b8-493c-a978-a4a58bc4f6b8",
+      "startPoint": {
+        "x": 840,
+        "y": 355
+      },
+      "endPoint": {
+        "x": 840,
+        "y": 435
+      },
+      "properties": {},
+      "text": {
+        "x": 850,
+        "y": 400,
+        "value": "N"
+      },
+      "pointsList": [
+        {
+          "x": 840,
+          "y": 355
+        },
+        {
+          "x": 840,
+          "y": 435
+        }
+      ]
+    },
+    {
+      "id": "2b3007ed-7a13-4db7-a1ea-6691d7564c34",
+      "type": "polyline",
+      "sourceNodeId": "abf76937-63b8-493c-a978-a4a58bc4f6b8",
+      "targetNodeId": "60326ad9-cae2-4a85-ae98-d340fb7bd67f",
+      "startPoint": {
+        "x": 875,
+        "y": 470
+      },
+      "endPoint": {
+        "x": 970,
+        "y": 470
+      },
+      "properties": {},
+      "pointsList": [
+        {
+          "x": 875,
+          "y": 470
+        },
+        {
+          "x": 970,
+          "y": 470
+        }
+      ]
+    },
+    {
+      "id": "262e2263-6c8c-4a38-b223-97848e9b5767",
+      "type": "polyline",
+      "sourceNodeId": "647fa2bc-98ee-40cf-99c5-4756c0bc130d",
+      "targetNodeId": "414fe028-3609-4450-b0f4-e5aca7705e8c",
+      "startPoint": {
+        "x": 725,
+        "y": 170
+      },
+      "endPoint": {
+        "x": 835,
+        "y": 170
+      },
+      "properties": {},
+      "pointsList": [
+        {
+          "x": 725,
+          "y": 170
+        },
+        {
+          "x": 835,
+          "y": 170
+        }
+      ]
+    }
+  ]
+}

web/src/view/process/bpmn/dataLogicflow.json

@@ -0,0 +1,214 @@
+{
+  "nodes": [
+    {
+      "id": "Event_1d42u4p",
+      "type": "bpmn:startEvent",
+      "x": 280,
+      "y": 200,
+      "properties": {
+        "a": "efrwe",
+        "b": "wewe",
+        "name": "开始"
+      },
+      "text": {
+        "x": 280,
+        "y": 200,
+        "value": "开始"
+      }
+    },
+    {
+      "id": "Event_08p8i6q",
+      "type": "bpmn:endEvent",
+      "x": 920,
+      "y": 200,
+      "properties": {
+        "a": "efrwe",
+        "b": "wewe",
+        "name": "结束"
+      },
+      "text": {
+        "x": 920,
+        "y": 200,
+        "value": "结束"
+      }
+    },
+    {
+      "id": "Gateway_1fngqgj",
+      "type": "bpmn:exclusiveGateway",
+      "x": 580,
+      "y": 200,
+      "properties": {
+        "a": "efrwe",
+        "b": "wewe",
+        "name": "网关"
+      },
+      "text": {
+        "x": 580,
+        "y": 200,
+        "value": "网关"
+      }
+    },
+    {
+      "id": "Activity_2mgtaia",
+      "type": "bpmn:userTask",
+      "x": 420,
+      "y": 200,
+      "properties": {
+        "a": "efrwe",
+        "b": "wewe",
+        "name": "用户"
+      },
+      "text": {
+        "x": 420,
+        "y": 200,
+        "value": "用户"
+      }
+    },
+    {
+      "id": "Activity_1sp8qc8",
+      "type": "bpmn:serviceTask",
+      "x": 760,
+      "y": 200,
+      "properties": {
+        "a": "efrwe",
+        "b": "wewe",
+        "name": "服务"
+      },
+      "text": {
+        "x": 760,
+        "y": 200,
+        "value": "服务"
+      }
+    }
+  ],
+  "edges": [
+    {
+      "id": "Flow_33inf2k",
+      "type": "bpmn:sequenceFlow",
+      "sourceNodeId": "Event_1d42u4p",
+      "targetNodeId": "Activity_2mgtaia",
+      "startPoint": {
+        "x": 298,
+        "y": 200
+      },
+      "endPoint": {
+        "x": 370,
+        "y": 200
+      },
+      "properties": {
+        "name": "边"
+      },
+      "text": {
+        "x": 331,
+        "y": 200,
+        "value": "边"
+      },
+      "pointsList": [
+        {
+          "x": 298,
+          "y": 200
+        },
+        {
+          "x": 370,
+          "y": 200
+        }
+      ]
+    },
+    {
+      "id": "Flow_0pfouf0",
+      "type": "bpmn:sequenceFlow",
+      "sourceNodeId": "Activity_2mgtaia",
+      "targetNodeId": "Gateway_1fngqgj",
+      "startPoint": {
+        "x": 470,
+        "y": 200
+      },
+      "endPoint": {
+        "x": 555,
+        "y": 200
+      },
+      "properties": {
+        "name": "边2"
+      },
+      "text": {
+        "x": 507,
+        "y": 200,
+        "value": "边2"
+      },
+      "pointsList": [
+        {
+          "x": 470,
+          "y": 200
+        },
+        {
+          "x": 555,
+          "y": 200
+        }
+      ]
+    },
+    {
+      "id": "Flow_3918lhh",
+      "type": "bpmn:sequenceFlow",
+      "sourceNodeId": "Gateway_1fngqgj",
+      "targetNodeId": "Activity_1sp8qc8",
+      "startPoint": {
+        "x": 605,
+        "y": 200
+      },
+      "endPoint": {
+        "x": 710,
+        "y": 200
+      },
+      "properties": {
+        "name": "边3"
+      },
+      "text": {
+        "x": 664,
+        "y": 200,
+        "value": "边3"
+      },
+      "pointsList": [
+        {
+          "x": 605,
+          "y": 200
+        },
+        {
+          "x": 710,
+          "y": 200
+        }
+      ]
+    },
+    {
+      "id": "Flow_379e0o9",
+      "type": "bpmn:sequenceFlow",
+      "sourceNodeId": "Activity_1sp8qc8",
+      "targetNodeId": "Event_08p8i6q",
+      "startPoint": {
+        "x": 810,
+        "y": 200
+      },
+      "endPoint": {
+        "x": 902,
+        "y": 200
+      },
+      "properties": {
+        "name": "边4"
+      },
+      "text": {
+        "x": 871,
+        "y": 200,
+        "value": "边4"
+      },
+      "pointsList": [
+        {
+          "x": 810,
+          "y": 200
+        },
+        {
+          "x": 902,
+          "y": 200
+        }
+      ]
+    }
+  ]
+}

web/src/view/process/bpmn/dataTurbo.json

@@ -0,0 +1,240 @@
+{
+  "flowElementList": [
+    {
+      "incoming": [],
+      "outgoing": ["Flow_33inf2k"],
+      "dockers": [],
+      "type": 2,
+      "properties": {
+        "a": "efrwe",
+        "b": "wewe",
+        "name": "开始",
+        "x": 280,
+        "y": 200,
+        "text": {
+          "x": 280,
+          "y": 200,
+          "value": "开始"
+        },
+        "logicFlowType": "bpmn:startEvent"
+      },
+      "key": "Event_1d42u4p"
+    },
+    {
+      "incoming": ["Flow_379e0o9"],
+      "outgoing": [],
+      "dockers": [],
+      "type": 3,
+      "properties": {
+        "a": "efrwe",
+        "b": "wewe",
+        "name": "结束",
+        "x": 920,
+        "y": 200,
+        "text": {
+          "x": 920,
+          "y": 200,
+          "value": "结束"
+        },
+        "logicFlowType": "bpmn:endEvent"
+      },
+      "key": "Event_08p8i6q"
+    },
+    {
+      "incoming": ["Flow_0pfouf0"],
+      "outgoing": ["Flow_3918lhh"],
+      "dockers": [],
+      "type": 6,
+      "properties": {
+        "a": "efrwe",
+        "b": "wewe",
+        "name": "网关",
+        "x": 580,
+        "y": 200,
+        "text": {
+          "x": 580,
+          "y": 200,
+          "value": "网关"
+        },
+        "logicFlowType": "bpmn:exclusiveGateway"
+      },
+      "key": "Gateway_1fngqgj"
+    },
+    {
+      "incoming": ["Flow_33inf2k"],
+      "outgoing": ["Flow_0pfouf0"],
+      "dockers": [],
+      "type": 4,
+      "properties": {
+        "a": "efrwe",
+        "b": "wewe",
+        "name": "用户",
+        "x": 420,
+        "y": 200,
+        "text": {
+          "x": 420,
+          "y": 200,
+          "value": "用户"
+        },
+        "logicFlowType": "bpmn:userTask"
+      },
+      "key": "Activity_2mgtaia"
+    },
+    {
+      "incoming": ["Flow_3918lhh"],
+      "outgoing": ["Flow_379e0o9"],
+      "dockers": [],
+      "type": 5,
+      "properties": {
+        "a": "efrwe",
+        "b": "wewe",
+        "name": "服务",
+        "x": 760,
+        "y": 200,
+        "text": {
+          "x": 760,
+          "y": 200,
+          "value": "服务"
+        },
+        "logicFlowType": "bpmn:serviceTask"
+      },
+      "key": "Activity_1sp8qc8"
+    },
+    {
+      "incoming": ["Event_1d42u4p"],
+      "outgoing": ["Activity_2mgtaia"],
+      "type": 1,
+      "dockers": [],
+      "properties": {
+        "name": "边",
+        "text": {
+          "x": 331,
+          "y": 200,
+          "value": "边"
+        },
+        "startPoint": {
+          "x": 298,
+          "y": 200
+        },
+        "endPoint": {
+          "x": 370,
+          "y": 200
+        },
+        "pointsList": [
+          {
+            "x": 298,
+            "y": 200
+          },
+          {
+            "x": 370,
+            "y": 200
+          }
+        ],
+        "logicFlowType": "bpmn:sequenceFlow"
+      },
+      "key": "Flow_33inf2k"
+    },
+    {
+      "incoming": ["Activity_2mgtaia"],
+      "outgoing": ["Gateway_1fngqgj"],
+      "type": 1,
+      "dockers": [],
+      "properties": {
+        "name": "边2",
+        "text": {
+          "x": 507,
+          "y": 200,
+          "value": "边2"
+        },
+        "startPoint": {
+          "x": 470,
+          "y": 200
+        },
+        "endPoint": {
+          "x": 555,
+          "y": 200
+        },
+        "pointsList": [
+          {
+            "x": 470,
+            "y": 200
+          },
+          {
+            "x": 555,
+            "y": 200
+          }
+        ],
+        "logicFlowType": "bpmn:sequenceFlow"
+      },
+      "key": "Flow_0pfouf0"
+    },
+    {
+      "incoming": ["Gateway_1fngqgj"],
+      "outgoing": ["Activity_1sp8qc8"],
+      "type": 1,
+      "dockers": [],
+      "properties": {
+        "name": "边3",
+        "text": {
+          "x": 664,
+          "y": 200,
+          "value": "边3"
+        },
+        "startPoint": {
+          "x": 605,
+          "y": 200
+        },
+        "endPoint": {
+          "x": 710,
+          "y": 200
+        },
+        "pointsList": [
+          {
+            "x": 605,
+            "y": 200
+          },
+          {
+            "x": 710,
+            "y": 200
+          }
+        ],
+        "logicFlowType": "bpmn:sequenceFlow"
+      },
+      "key": "Flow_3918lhh"
+    },
+    {
+      "incoming": ["Activity_1sp8qc8"],
+      "outgoing": ["Event_08p8i6q"],
+      "type": 1,
+      "dockers": [],
+      "properties": {
+        "name": "边4",
+        "text": {
+          "x": 871,
+          "y": 200,
+          "value": "边4"
+        },
+        "startPoint": {
+          "x": 810,
+          "y": 200
+        },
+        "endPoint": {
+          "x": 902,
+          "y": 200
+        },
+        "pointsList": [
+          {
+            "x": 810,
+            "y": 200
+          },
+          {
+            "x": 902,
+            "y": 200
+          }
+        ],
+        "logicFlowType": "bpmn:sequenceFlow"
+      },
+      "key": "Flow_379e0o9"
+    }
+  ]
+}

web/src/view/process/bpmn/registerNode/Connect.vue

@@ -0,0 +1,43 @@
+<template>
+  <div class="connect">
+    <p>{{name}}</p>
+    <p>您好，请问需要买保险吗？</p>
+    <div class="button-list">
+      <button @mousedown.stop="done(1)">有保险了</button>
+      <button @mousedown.stop="done(2)">不需要</button>
+      <button @mousedown.stop="done(3)">需要</button>
+      <button @mousedown.stop="done(4)">特殊</button>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  props: {
+    name: String
+  },
+  methods: {
+    done(type) {
+      this.$emit('select-button', type)
+    }
+  }
+}
+</script>
+
+<style scoped>
+.connect {
+  width: 100%;
+  height: 100%;
+  background: #FFF;
+  border: 1px solid #9a9a9b;
+  box-sizing: border-box;
+  padding: 10px;
+}
+.connect p {
+  margin: 0;
+}
+.button-list {
+  position: absolute;
+  bottom: 10px;
+}
+</style>

web/src/view/process/bpmn/registerNode/index.js

@@ -0,0 +1,13 @@
+
+// svg png 图片资源来自阿里字体库
+// [阿里字体库](https://www.iconfont.cn/collections/index?spm=a313x.7781069.1998910419.4)
+// svg图标建议使用自己创建的
+import registerStart from './registerStart'
+import registerUser from './registerUser'
+import registerEnd from './registerEnd'
+import registerPush from './registerPush'
+import registerDownload from './registerDownload'
+import registerPolyline from './registerPolyline'
+import registerTask from './registerTask'
+import registerConnect from './registerConnect'
+export { registerStart, registerUser, registerEnd, registerPush, registerDownload, registerPolyline, registerTask, registerConnect }

web/src/view/process/bpmn/registerNode/registerConnect.js

@@ -0,0 +1,58 @@
+import Vue from 'vue'
+import Connect from './Connect.vue'
+
+export default function registerConnect (lf) {
+  lf.register('connect', ({ HtmlNode, HtmlNodeModel }) => {
+    class ConnectNode extends HtmlNode {
+      shouldUpdate() {
+        const { properties } = this.getAttributes();
+        if (this.currrentProperties && this.currrentProperties === JSON.stringify(properties)) return false;
+        this.currrentProperties = JSON.stringify(properties)
+        return true;
+      }
+      setHtml(rootEl) {
+        // todo: 和react不一样，还没有找到合适的利用vue内置的diff算法来计算节点是否需要更新。
+        if (!this.shouldUpdate()) return;
+        const { properties } = this.getAttributes();
+        const el = document.createElement('div');
+        rootEl.innerHTML = '';
+        rootEl.appendChild(el);
+        const Profile = Vue.extend({
+          render: function (h) {
+            return h(Connect, {
+              props: {
+                name: properties.name
+              },
+              on: {
+                'select-button': (type) => {
+                  console.log('select-button', type)
+                }
+              }
+            })
+          }
+        })
+        new Profile().$mount(el)
+      }
+    }
+    class ConnectNodeModel extends HtmlNodeModel {
+      setAttributes() {
+        this.text.editable = false;
+        const width = 300;
+        const height = 150;
+        this.width = width;
+        this.height = height;
+
+        this.anchorsOffset = [
+          [width / 2, 0],
+          [0, height / 2],
+          [-width / 2, 0],
+          [0, -height/2],
+        ]
+      }
+    }
+    return {
+      view: ConnectNode,
+      model: ConnectNodeModel
+    }
+  })
+}

web/src/view/process/bpmn/registerNode/registerDownload.js

@@ -0,0 +1,92 @@
+const NODE_COLOR = '#9932CC'
+export default function registerDownload(lf) {
+  lf.register('download', ({ PolygonNode, PolygonNodeModel, h }) => {
+    class Node extends PolygonNode {
+      getIconShape () {
+        return h(
+          'svg',
+          {
+            x: 14,
+            y: 13,
+            width: 23,
+            height: 23,
+            viewBox: '0 0 1024 1024'
+          },
+          h(
+            'path',
+            {
+              fill: NODE_COLOR,
+              d: 'M831.513034 319.863005h-95.945189c-17.662265 0-31.980365 14.3181-31.980365 31.980365 0 17.662265 14.3181 31.980365 31.980365 31.980366h64.218604c17.520025 0 31.722492 14.202467 31.722492 31.722492V863.786065c0 17.520025-14.202467 31.722492-31.722492 31.722492H159.66442c-17.520025 0-31.722492-14.202467-31.722493-31.722492V415.546228c0-17.520025 14.202467-31.722492 31.722493-31.722492h64.218603c17.662265 0 31.980365-14.3181 31.980366-31.980366 0-17.662265-14.3181-31.980365-31.980366-31.980365H127.937834c-35.322483 0-63.956637 28.634154-63.956637 63.956637v511.693008c0 35.322483 28.634154 63.956637 63.956637 63.956638h703.5752c35.322483 0 63.956637-28.634154 63.956638-63.956638V383.819642c0-35.32146-28.634154-63.956637-63.956638-63.956637z'
+            }
+          ),
+          h(
+            'path',
+            {
+              fill: NODE_COLOR,
+              d: 'M310.382073 521.036817c-12.388145-12.388145-32.473599-12.388145-44.862767 0l-0.364297 0.364297c-12.388145 12.388145-12.388145 32.473599 0 44.862767l190.186573 190.186574c5.818519 6.813173 14.465456 11.137665 24.126491 11.137664h0.515746c9.662057 0 18.307971-4.324492 24.12649-11.137664L694.296883 566.263881c12.388145-12.388145 12.388145-32.473599 0-44.862767l-0.364297-0.364297c-12.388145-12.388145-32.473599-12.388145-44.862767 0L511.706311 658.400325V95.743598c0-17.520025-14.202467-31.722492-31.722492-31.722492h-0.515746c-17.520025 0-31.722492 14.202467-31.722493 31.722492v562.656727L310.382073 521.036817z'
+            }
+          )
+        )
+      }
+      getShape () {
+        const attributes = this.getAttributes()
+        const {
+          width,
+          height,
+          x,
+          y,
+          fill,
+          fillOpacity,
+          strokeWidth,
+          stroke,
+          strokeOpacity,
+          points
+        } = attributes
+        const transform = `matrix(1 0 0 1 ${x - width / 2} ${y - height / 2})`
+        const pointsPath = points.map(point => point.join(',')).join(' ')
+        return h(
+          'g',
+          {
+            transform
+          },
+          [
+            h(
+              'polygon',
+              {
+                points: pointsPath,
+                fill,
+                stroke,
+                strokeWidth,
+                strokeOpacity,
+                fillOpacity
+              }
+            ),
+            this.getIconShape()
+          ]
+        )
+      }
+    }
+    class Model extends PolygonNodeModel {
+      constructor (data, graphModel) {
+        data.text = {
+          value: (data.text && data.text.value) || '',
+          x: data.x,
+          y: data.y + 50
+        }
+        super(data, graphModel)
+        const lenght = 25
+        this.points = [
+          [lenght, 0],
+          [lenght * 2, lenght],
+          [lenght, lenght * 2],
+          [0, lenght]
+        ]
+        this.stroke = NODE_COLOR
+      }
+    }
+    return {
+      view: Node,
+      model: Model
+    }
+  })
+}

web/src/view/process/bpmn/registerNode/registerEnd.js

@@ -0,0 +1,101 @@
+export default function registerEnd (lf) {
+  lf.register('end', ({ CircleNode, CircleNodeModel, h }) => {
+    class EndNode extends CircleNode {
+      getIconShape () {
+        const attributes = this.getAttributes()
+        const {
+          x,
+          y,
+          width,
+          height
+        } = attributes
+        const stroke = '#404040'
+        return h(
+          'svg',
+          {
+            x: x - width / 2,
+            y: y - height / 2,
+            width: 40,
+            height: 40,
+            viewBox: '0 0 1024 1024'
+          },
+          h(
+            'path',
+            {
+              fill: stroke,
+              d: 'M212.992 526.336 212.992 526.336 212.992 526.336 215.04 526.336 212.992 526.336Z'
+            }
+          ),
+          // 圆形外框隐藏
+          // h(
+          //   'path',
+          //   {
+          //     fill: stroke,
+          //     d: 'M817.152 202.752 817.152 202.752C737.28 122.88 628.736 75.776 509.952 75.776c-118.784 0-229.376 49.152-307.2 126.976l0 0c-77.824 77.824-126.976 186.368-126.976 307.2 0 118.784 49.152 229.376 126.976 307.2 77.824 79.872 188.416 126.976 307.2 126.976 120.832 0 229.376-49.152 307.2-126.976 79.872-77.824 126.976-186.368 126.976-307.2C946.176 389.12 897.024 280.576 817.152 202.752zM770.048 770.048c-65.536 65.536-157.696 108.544-260.096 108.544-102.4 0-194.56-40.96-260.096-108.544C184.32 704.512 141.312 612.352 141.312 509.952s40.96-194.56 108.544-260.096C317.44 184.32 409.6 141.312 509.952 141.312c100.352 0 192.512 40.96 258.048 106.496l2.048 2.048c65.536 65.536 108.544 157.696 108.544 260.096S837.632 704.512 770.048 770.048z'
+          //   }
+          // ),
+          h(
+            'path',
+            {
+              fill: stroke,
+              d: 'M724.992 296.96 724.992 296.96 296.96 296.96 296.96 724.992 724.992 724.992 724.992 296.96Z'
+            }
+          )
+        )
+      }
+      getShape () {
+        const attributes = this.getAttributes()
+        const {
+          x,
+          y,
+          r,
+          fill,
+          stroke,
+          strokeWidth
+        } = attributes
+        return h(
+          'g',
+          {
+          },
+          [
+            h(
+              'circle',
+              {
+                cx: x,
+                cy: y,
+                r,
+                fill,
+                stroke,
+                strokeWidth
+              }
+            ),
+            this.getIconShape()
+          ]
+        )
+      }
+    }
+    class EndModel extends CircleNodeModel {
+      constructor (data, graphModel) {
+        data.text = {
+          value: (data.text && data.text.value) || '',
+          x: data.x,
+          y: data.y + 35
+        }
+        super(data, graphModel)
+      }
+      getConnectedSourceRules () {
+        const rules = super.getConnectedSourceRules()
+        const notAsTarget = {
+          message: '终止节点不能作为连线的起点',
+          validate: () => false
+        }
+        rules.push(notAsTarget)
+        return rules
+      }
+    }
+    return {
+      view: EndNode,
+      model: EndModel
+    }
+  })
+}

web/src/view/process/bpmn/registerNode/registerPolyline.js

@@ -0,0 +1,13 @@
+export default function registerPolyline (lf) {
+  lf.register('polyline', ({ PolylineEdge, PolylineEdgeModel }) => {
+    class ConnnectionModel extends PolylineEdgeModel {
+      constructor (data, graphModel) {
+        super(data, graphModel)
+      }
+    }
+    return {
+      view: PolylineEdge,
+      model: ConnnectionModel
+    }
+  })
+}

web/src/view/process/bpmn/registerNode/registerPush.js

@@ -0,0 +1,139 @@
+export default function registerPush (lf, clickPlus, mouseDownPlus) {
+  lf.register('push', ({ PolygonNode, PolygonNodeModel, h }) => {
+    class Node extends PolygonNode {
+      getIconShape () {
+        const attributes = this.getAttributes()
+        const {
+          stroke
+        } = attributes
+        return h(
+          'svg',
+          {
+            x: 18,
+            y: 18,
+            width: 30,
+            height: 30,
+            viewBox: '0 0 1024 1024'
+          },
+          h(
+            'path',
+            {
+              fill: stroke,
+              d: 'M866.461538 39.384615H393.846154c-43.323077 0-78.769231 35.446154-78.769231 78.769231v1.969231c0 13.784615 7.876923 27.569231 19.692308 35.446154 5.907692 3.938462 80.738462 78.769231 80.738461 78.769231 5.907692 5.907692 15.753846 0 15.753846-7.876924 0-15.753846 13.784615-31.507692 29.538462-31.507692h334.769231c15.753846 0 31.507692 15.753846 31.507692 31.507692v531.692308c0 15.753846-15.753846 27.569231-31.507692 27.569231h-334.769231c-15.753846 0-27.569231-11.815385-27.569231-27.569231v-1.969231c0-7.876923-9.846154-11.815385-15.753846-5.907692 0 0-74.830769 74.830769-82.707692 78.769231-11.815385 7.876923-19.692308 19.692308-19.692308 35.446154v39.384615c0 43.323077 33.476923 78.769231 76.8 78.769231h472.615385c43.323077 0 80.738462-35.446154 80.738461-78.769231V118.153846c0-43.323077-35.446154-78.769231-78.769231-78.769231zM630.153846 945.230769c-33.476923 0-59.076923-25.6-59.076923-59.076923s25.6-59.076923 59.076923-59.076923 59.076923 25.6 59.076923 59.076923-25.6 59.076923-59.076923 59.076923z m-86.646154-474.584615L297.353846 224.492308c-11.815385-11.815385-29.538462-11.815385-41.353846 0l-41.353846 41.353846c-11.815385 11.815385-11.815385 29.538462 0 41.353846l90.584615 90.584615c11.815385 11.815385 3.938462 33.476923-13.784615 33.476923H29.538462c-15.753846 1.969231-29.538462 15.753846-29.538462 31.507693v59.076923c0 15.753846 13.784615 29.538462 29.538462 29.538461h259.938461c17.723077 0 25.6 21.661538 13.784615 33.476923l-90.584615 90.584616c-11.815385 11.815385-11.815385 29.538462 0 41.353846l41.353846 41.353846c11.815385 11.815385 29.538462 11.815385 41.353846 0L543.507692 512c9.846154-9.846154 9.846154-29.538462 0-41.353846z'
+            }
+          )
+        )
+      }
+      getPulsShape () {
+        const attributes = this.getAttributes()
+        // 判断当前节点是否子节点
+        const graphData = lf.getGraphData()
+        const edges = graphData.edges
+        let hasChildNode = false
+        edges.some(item => {
+          if (item.sourceNodeId === attributes.id) {
+            hasChildNode = true
+            return true
+          }
+        })
+        if (hasChildNode) {
+          return
+        }
+        return h(
+          'svg',
+          {
+            x: 70,
+            y: 20,
+            width: 30,
+            height: 30,
+            viewBox: '0 0 1024 1024',
+            class: 'time-plus',
+            onClick: (e) => clickPlus(e, attributes),
+            onMousedown: (e) => mouseDownPlus(e, attributes),
+            onMouseUp: (e) => mouseDownPlus(e, attributes)
+          },
+          h(
+            'path',
+            {
+              fill: '#f17611',
+              d: 'M512 512m-448 0a448 448 0 1 0 896 0 448 448 0 1 0-896 0Z'
+            }
+          ),
+          h(
+            'path',
+            {
+              fill: '#ffffff',
+              d: 'M448 298.666667h128v426.666666h-128z'
+            }
+          ),
+          h(
+            'path',
+            {
+              fill: '#ffffff',
+              d: 'M298.666667 448h426.666666v128H298.666667z'
+            }
+          )
+        )
+      }
+      getShape () {
+        const attributes = this.getAttributes()
+        const {
+          width,
+          height,
+          x,
+          y,
+          fill,
+          fillOpacity,
+          strokeWidth,
+          stroke,
+          strokeOpacity,
+          points
+        } = attributes
+        const transform = `matrix(1 0 0 1 ${x - width / 2} ${y - height / 2})`
+        const pointsPath = points.map(point => point.join(',')).join(' ')
+        return h(
+          'g',
+          {
+            transform
+          },
+          [
+            h(
+              'polygon',
+              {
+                points: pointsPath,
+                fill,
+                stroke,
+                strokeWidth,
+                strokeOpacity,
+                fillOpacity
+              }
+            ),
+            this.getIconShape(),
+            this.getPulsShape()
+          ]
+        )
+      }
+    }
+    class Model extends PolygonNodeModel {
+      constructor (data, graphModel) {
+        data.text = {
+          value: (data.text && data.text.value) || '',
+          x: data.x,
+          y: data.y + 50
+        }
+        super(data, graphModel)
+        const lenght = 35
+        this.points = [
+          [lenght, 0],
+          [lenght * 2, lenght],
+          [lenght, lenght * 2],
+          [0, lenght]
+        ]
+      }
+    }
+    return {
+      view: Node,
+      model: Model
+    }
+  })
+}

web/src/view/process/bpmn/registerNode/registerStart.js

@@ -0,0 +1,80 @@
+export default function registerStart (lf) {
+  lf.register('start', ({ CircleNode, CircleNodeModel, h }) => {
+    class StartNode extends CircleNode {
+      getLabelShape () {
+        const attributes = this.getAttributes()
+        const {
+          x,
+          y
+        } = attributes
+        return h(
+          'text',
+          {
+            fill: '#000000',
+            fontSize: 12,
+            x: x - 12,
+            y: y + 4,
+            width: 50,
+            height: 25
+          },
+          'Start'
+        )
+      }
+      getShape () {
+        const attributes = this.getAttributes()
+        const {
+          x,
+          y,
+          r,
+          fill,
+          stroke,
+          strokeWidth
+        } = attributes
+        return h(
+          'g',
+          {
+          },
+          [
+            h(
+              'circle',
+              {
+                cx: x,
+                cy: y,
+                r,
+                fill,
+                stroke,
+                strokeWidth
+              }
+            ),
+            this.getLabelShape()
+          ]
+        )
+      }
+    }
+    class StartModel extends CircleNodeModel {
+      constructor (data, graphModel) {
+        data.text = {
+          value: (data.text && data.text.value) || '',
+          x: data.x,
+          y: data.y + 35,
+          dragable: false,
+          editable: true
+        }
+        super(data, graphModel)
+      }
+      getConnectedTargetRules () {
+        const rules = super.getConnectedTargetRules()
+        const notAsTarget = {
+          message: '起始节点不能作为连线的终点',
+          validate: () => false
+        }
+        rules.push(notAsTarget)
+        return rules
+      }
+    }
+    return {
+      view: StartNode,
+      model: StartModel
+    }
+  })
+}

web/src/view/process/bpmn/registerNode/registerTask.js

@@ -0,0 +1,30 @@
+export default function registerTask (lf) {
+  lf.register('task', ({ RectNode, RectNodeModel, h }) => {
+    class View extends RectNode {
+      getShape() {
+        const style = this.getShapeStyle();
+        console.log(style);
+        const { width, height } = style;
+        const { x, y } = this.getAttributes();
+        const position = {
+          x: x - width / 2,
+          y: y- height / 2,
+        }
+        return h("rect", {
+          ...style,
+          ...position,
+        });
+      }
+    }
+    class Model extends RectNodeModel {
+      constructor (data, graphModel) {
+        super(data, graphModel)
+        this.radius = 20;
+      }
+    }
+    return {
+      view: View,
+      model: Model
+    }
+  })
+}

web/src/view/process/bpmn/registerNode/registerUser.js

@@ -0,0 +1,112 @@
+export default function registerUser (lf) {
+  lf.register('user', ({ PolygonNode, PolygonNodeModel, h }) => {
+    class Node extends PolygonNode {
+      getIconShape () {
+        const attributes = this.getAttributes()
+        const {
+          stroke
+        } = attributes
+        return h(
+          'svg',
+          {
+            x: 20,
+            y: 18,
+            width: 30,
+            height: 30,
+            viewBox: '0 0 1126 1024'
+          },
+          h(
+            'path',
+            {
+              fill: stroke,
+              d: 'M792.576 379.392a25.6 25.6 0 0 0 25.2928 25.8048h283.2384A25.6 25.6 0 0 0 1126.4 379.392a25.6 25.6 0 0 0-25.2928-25.8048h-283.2384a25.6 25.6 0 0 0-25.344 25.8048z m303.9232 80.7424H761.856c-16.5376 0-29.9008 11.6224-29.9008 25.7536 0 14.1824 13.312 25.7536 29.9008 25.7536h334.6432c16.4864 0 29.9008-11.5712 29.9008-25.7536 0-14.1312-13.4144-25.7536-29.9008-25.7536z m4.608 106.496h-283.2384a25.6 25.6 0 0 0-25.344 25.7536 25.6 25.6 0 0 0 25.344 25.7536h283.2384A25.6 25.6 0 0 0 1126.4 592.384a25.6 25.6 0 0 0-25.2928-25.8048zM543.0272 1024H341.6576C150.8352 1024 0 1024 0 923.648v-20.1216c0-188.16 153.2928-341.1968 341.7088-341.1968h201.2672c188.416 0 341.76 153.0368 341.76 341.1968v20.0704C884.6848 1024 726.3232 1024 542.976 1024z m-203.1616-405.1456c-158.464 0-287.4368 128.4096-287.4368 286.208v20.48c0 40.9088 166.0928 40.9088 287.4368 40.9088h204.9536c100.4544 0 287.4368 0 287.4368-40.96v-20.3776c0-157.8496-128.9728-286.208-287.4368-286.208H339.8656z m92.416-76.7488a271.4112 271.4112 0 0 1-271.2064-271.0528A271.36 271.36 0 0 1 432.2816 0a271.36 271.36 0 0 1 271.2064 271.0528 271.4624 271.4624 0 0 1-271.2064 271.0528z m-215.3472-271.872c0 118.1696 96.6144 214.3232 215.3472 214.3232 118.784 0 215.3984-96.1536 215.3984-214.3232 0-118.2208-96.6144-214.3232-215.3984-214.3232S216.9344 152.0128 216.9344 270.2336z'
+            }
+          )
+        )
+      }
+      getShape () {
+        const attributes = this.getAttributes()
+        const {
+          width,
+          height,
+          x,
+          y,
+          fill,
+          fillOpacity,
+          strokeWidth,
+          stroke,
+          strokeOpacity,
+          points
+        } = attributes
+        const transform = `matrix(1 0 0 1 ${x - width / 2} ${y - height / 2})`
+        const pointsPath = points.map(point => point.join(',')).join(' ')
+        return h(
+          'g',
+          {
+            transform
+          },
+          [
+            h(
+              'polygon',
+              {
+                points: pointsPath,
+                fill,
+                stroke,
+                strokeWidth,
+                strokeOpacity,
+                fillOpacity
+              }
+            ),
+            this.getIconShape()
+          ]
+        )
+      }
+    }
+    class Model extends PolygonNodeModel {
+      constructor (data, graphModel) {
+        data.text = {
+          value: (data.text && data.text.value) || '',
+          x: data.x,
+          y: data.y + 50
+        }
+        super(data, graphModel)
+        const lenght = 35
+        this.points = [
+          [lenght, 0],
+          [lenght * 2, lenght],
+          [lenght, lenght * 2],
+          [0, lenght]
+        ]
+        // 右键菜单自由配置，也可以通过边的properties或者其他属性条件更换不同菜单
+        this.menu = [
+          {
+            className: 'lf-menu-delete',
+            text: 'delete',
+            callback (node) {
+              // const comfirm = window.confirm('你确定要删除吗？')
+              lf.deleteNode(node.id)
+            }
+          },
+          {
+            text: 'edit',
+            className: 'lf-menu-item',
+            callback (node) {
+              lf.editNodeText(node.id)
+            }
+          },
+          {
+            text: 'copy',
+            className: 'lf-menu-item',
+            callback (node) {
+              lf.cloneNode(node.id)
+            }
+          }
+        ]
+      }
+    }
+    return {
+      view: Node,
+      model: Model
+    }
+  })
+}

web/src/view/process/bpmn1/CustomTranslate.js

@@ -0,0 +1,20 @@
+import translate from '../bpmn1/translate';
+
+
+export default function customTranslate(template, replacements) {
+  replacements = replacements || {};
+
+  // Translate
+  template = translate[template] || template;
+
+  // Replace
+  return template.replace(/{([^}]+)}/g, function(_, key) {
+
+	 var str=replacements[key];
+	  if(translate[replacements[key]]!=null&&translate[replacements[key]]!='undefined'){
+		  str=translate[replacements[key]];
+	  }
+    return  str || '{' + key + '}';
+  
+  });
+}

web/src/view/process/bpmn1/index.vue

@@ -0,0 +1,210 @@
+<template>
+    <div class="processDrawBody">
+        <el-button-group>
+            <el-button size="mini" @click="showProcessInfo">xml数据</el-button>
+            <el-button type="primary" size="mini" @click="handleUndo">撤销</el-button>
+            <el-button type="success" size="mini" @click="handleRedo">恢复</el-button>
+            <el-button type="warning" size="mini" @click="handleDownload">下载</el-button>
+            <el-upload
+                    style="display: inline-block;"
+                    :file-list="fileList"
+                    class="upload-demo"
+                    action=""
+                    :auto-upload="false"
+                    :show-file-list="false"
+                    :http-request="httpRequest"
+                    :on-change="handleOnchangeFile"
+                    :on-remove="handleRemove"
+                    :before-remove="beforeRemove"
+            >
+                <el-button type="danger" size="mini">导入</el-button>
+            </el-upload>
+        </el-button-group>
+        <div class="containerBox" style="position: relative;">
+            <div id="container">
+            </div>
+            <div id="js-properties-panel" class="panel"></div>
+        </div>
+    </div>
+</template>
+<script>
+    import CustomTranslate from '../bpmn1/CustomTranslate';
+
+    import { markRaw } from 'vue';
+    // bpmn-js相关
+    import 'bpmn-js/dist/assets/diagram-js.css';
+    import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css';
+    import BpmnModeler from 'bpmn-js/lib/Modeler';
+    // bpmn-js-properties-panel相关
+    import 'bpmn-js-properties-panel/dist/assets/bpmn-js-properties-panel.css'
+    import propertiesPanelModule from 'bpmn-js-properties-panel'
+    import propertiesProviderModule from 'bpmn-js-properties-panel/lib/provider/camunda'
+    import camundaModdleDescriptor from 'camunda-bpmn-moddle/resources/camunda'
+    // 其他
+    // import { processDeployment, getProcessXml } from "@/api/index.js";
+    export default {
+        props: ['deploymentId'],
+        data() {
+            return {
+                containerEl: null,
+                bpmnModeler: null,
+                fileList: []
+            };
+        },
+        mounted() {
+            // 初始化流程图
+            this.init();
+        },
+        methods: {
+            /**
+             * 初始化流程图
+             */
+            init() {
+                // 汉化
+                var customTranslate = {
+                    translate: ['value', CustomTranslate]
+                };
+                this.containerEl = document.getElementById('container');
+                // 加markRaw去除双向绑定作用域
+                this.bpmnModeler = markRaw(new BpmnModeler({
+                    container: this.containerEl,
+                    // 添加控制板
+                    propertiesPanel: {
+                        parent: '#js-properties-panel'
+                    },
+                    // 右侧属性面板
+                    additionalModules: [
+                        
+                        propertiesPanelModule,
+                        propertiesProviderModule,
+                        customTranslate
+                    ],
+                    moddleExtensions: {
+                        camunda: camundaModdleDescriptor
+                    }
+                }));
+                this.bpmnModeler.createDiagram(() => {
+                    this.bpmnModeler.get('canvas').zoom('fit-viewport');
+                });
+                let _this = this;
+                // 如果deploymentId存在，则为编辑，导入xml信息
+                if (_this.deploymentId) {
+                    getProcessXml({"deploymentId":_this.deploymentId})
+                        .then((res) => {
+                            _this.bpmnModeler.importXML(res.data, (err) => {
+                                this.$message.success('加载成功！');
+                            });
+                        })
+                        .catch((error) => {
+                            this.$message.error('获取流程信息失败');
+                        });
+                }
+            },
+            handleRemove(file) {
+                for (let i = 0; i < this.fileList.length; i++) {
+                    if (file.name === this.fileList[i].name) {
+                        this.fileList.splice(i, 1);
+                    }
+                }
+            },
+            beforeRemove(file) {
+                return this.$confirm(`确定移除 ${file.name}？`);
+            },
+            // 后退
+            handleUndo() {
+                this.bpmnModeler.get('commandStack').undo();
+            },
+            // 前进
+            handleRedo() {
+                this.bpmnModeler.get('commandStack').redo();
+            },
+            // 下载
+            handleDownload() {
+                this.bpmnModeler.saveXML({format: true}, (err, data) => {
+                    const dataTrack = 'bpmn';
+                    const a = document.createElement('a');
+                    const name = `diagram.${dataTrack}`;
+                    a.setAttribute(
+                        'href',
+                        `data:application/bpmn20-xml;charset=UTF-8,${encodeURIComponent(data)}`
+                    );
+                    a.setAttribute('target', '_blank');
+                    a.setAttribute('dataTrack', `diagram:download-${dataTrack}`);
+                    a.setAttribute('download', name);
+                    document.body.appendChild(a);
+                    a.click();
+                    document.body.removeChild(a);
+                });
+            },
+            // 导入成功回调
+            handleOnchangeFile(file) {
+                const reader = new FileReader();
+                let data = '';
+                reader.readAsText(file.raw);
+                reader.onload = (event) => {
+                    data = event.target.result;
+                    this.bpmnModeler.importXML(data, (err) => {
+                        debugger
+                        if (err) {
+                            this.$message.info('导入失败');
+                        } else {
+                            this.$message.success('导入成功');
+                        }
+                    });
+                };
+            },
+            // 取xml信息
+            showProcessInfo() {
+                this.bpmnModeler.saveXML({format: true}, (err, data) => {
+                    alert(data);
+                });
+            },
+            /**
+             * 保存
+             */
+            save() {
+                this.bpmnModeler.saveXML({format: true}, (err, data) => {
+                    let processInfo = {};
+                    processInfo.xml = data.replace(/camunda/ig,"activiti");
+                    processInfo.processId = document.getElementById("camunda-id").value;
+                    processInfo.processName = document.getElementById("camunda-name").innerHTML;
+                    processDeployment(processInfo)
+                        .then((res) => {
+                            console.log(res);
+                        })
+                        .catch((error) => {
+                            console.log(error);
+                        });
+                });
+            }
+        }
+    }
+</script>
+<style>
+    .processDrawBody {
+        height: 100%;
+        text-align: left;
+    }
+    .containerBox {
+        height: 600px;
+    }
+    .containerBox #container {
+        height: 100%;
+        border: 1px solid rgb(121, 121, 121);
+    }
+    .bpp-properties-panel [type=text] {
+        box-sizing: border-box;
+    }
+    .panel {
+        width: 400px;
+        position: absolute;
+        top: 1px;
+        right: 1px;
+        height:100%;
+        overflow: auto;
+    }
+    /* 右下角logo */
+    .bjs-powered-by {
+        display: none;
+    }
+</style>

web/src/view/process/bpmn1/translate.js

@@ -0,0 +1,258 @@
+export default {
+    'Activate the global connect tool': '激活全局连接工具',
+    'Append {type}': '添加 {type}',
+    'Add Lane above': '在上面添加道',
+    'Divide into two Lanes': '分割成两个道',
+    'Divide into three Lanes': '分割成三个道',
+    'Add Lane below': '在下面添加道',
+    'Append compensation activity': '追加补偿活动',
+    'Change type': '修改类型',
+    'Connect using Association': '使用关联连接',
+    'Connect using Sequence/MessageFlow or Association': '使用顺序/消息流或者关联连接',
+    'Connect using DataInputAssociation': '使用数据输入关联连接',
+    'Remove': '移除',
+    'Activate the hand tool': '激活抓手工具',
+    'Activate the lasso tool': '激活套索工具',
+    'Activate the create/remove space tool': '激活创建/删除空间工具',
+    'Create expanded SubProcess': '创建扩展子过程',
+    'Create IntermediateThrowEvent/BoundaryEvent': '创建中间抛出事件/边界事件',
+    'Create Pool/Participant': '创建池/参与者',
+    'Create Group':'创建组',
+    'Parallel Multi Instance': '并行多重事件',
+    'Sequential Multi Instance': '时序多重事件',
+    'DataObjectReference': '数据对象参考',
+    'DataStoreReference': '数据存储参考',
+    'Loop': '循环',
+    'Ad-hoc': '即席',
+    'Create {type}': '创建 {type}',
+    'Task': '任务',
+    'Send Task': '发送任务',
+    'Receive Task': '接收任务',
+    'User Task': '用户任务',
+    'Manual Task': '手工任务',
+    'Business Rule Task': '业务规则任务',
+    'Service Task': '服务任务',
+    'Script Task': '脚本任务',
+    'Call Activity': '调用活动',
+    'Sub Process (collapsed)': '子流程（折叠的）',
+    'Sub Process (expanded)': '子流程（展开的）',
+    'Start Event': '开始事件',
+    'StartEvent': '开始事件',
+    'Intermediate Throw Event': '中间事件',
+    'End Event': '结束事件',
+    'EndEvent': '结束事件',
+    'Create Gateway': '创建网关',
+    'Create ExclusiveGateway': '创建互斥网关',
+    'Create ParallelGateway': '创建并行网关',
+    'Create InclusiveGateway': '创建相容网关',
+    'Create ComplexGateway': '创建复杂网关',
+    'Create EventbasedGateway': '创建事件网关',
+    'Create Intermediate/Boundary Event': '创建中间/边界事件',
+    'Message Start Event': '消息开始事件',
+    'Timer Start Event': '定时开始事件',
+    'Conditional Start Event': '条件开始事件',
+    'Signal Start Event': '信号开始事件',
+    'Error Start Event': '错误开始事件',
+    'Escalation Start Event': '升级开始事件',
+    'Compensation Start Event': '补偿开始事件',
+    'Message Start Event (non-interrupting)': '消息开始事件（非中断）',
+    'Timer Start Event (non-interrupting)': '定时开始事件（非中断）',
+    'Conditional Start Event (non-interrupting)': '条件开始事件（非中断）',
+    'Signal Start Event (non-interrupting)': '信号开始事件（非中断）',
+    'Escalation Start Event (non-interrupting)': '升级开始事件（非中断）',
+    'Message Intermediate Catch Event': '消息中间捕获事件',
+    'Message Intermediate Throw Event': '消息中间抛出事件',
+    'Timer Intermediate Catch Event': '定时中间捕获事件',
+    'Escalation Intermediate Throw Event': '升级中间抛出事件',
+    'Conditional Intermediate Catch Event': '条件中间捕获事件',
+    'Link Intermediate Catch Event': '链接中间捕获事件',
+    'Link Intermediate Throw Event': '链接中间抛出事件',
+    'Compensation Intermediate Throw Event': '补偿中间抛出事件',
+    'Signal Intermediate Catch Event': '信号中间捕获事件',
+    'Signal Intermediate Throw Event': '信号中间抛出事件',
+    'Message End Event': '消息结束事件',
+    'Escalation End Event': '定时结束事件',
+    'Error End Event': '错误结束事件',
+    'Cancel End Event': '取消结束事件',
+    'Compensation End Event': '补偿结束事件',
+    'Signal End Event': '信号结束事件',
+    'Terminate End Event': '终止结束事件',
+    'Message Boundary Event': '消息边界事件',
+    'Message Boundary Event (non-interrupting)': '消息边界事件（非中断）',
+    'Timer Boundary Event': '定时边界事件',
+    'Timer Boundary Event (non-interrupting)': '定时边界事件（非中断）',
+    'Escalation Boundary Event': '升级边界事件',
+    'Escalation Boundary Event (non-interrupting)': '升级边界事件（非中断）',
+    'Conditional Boundary Event': '条件边界事件',
+    'Conditional Boundary Event (non-interrupting)': '条件边界事件（非中断）',
+    'Error Boundary Event': '错误边界事件',
+    'Cancel Boundary Event': '取消边界事件',
+    'Signal Boundary Event': '信号边界事件',
+    'Signal Boundary Event (non-interrupting)': '信号边界事件（非中断）',
+    'Compensation Boundary Event': '补偿边界事件',
+    'Exclusive Gateway': '互斥网关',
+    'Parallel Gateway': '并行网关',
+    'Inclusive Gateway': '相容网关',
+    'Complex Gateway': '复杂网关',
+    'Event based Gateway': '事件网关',
+    'Transaction': '转运',
+    'Sub Process': '子流程',
+    'Event Sub Process': '事件子流程',
+    'Collapsed Pool': '折叠池',
+    'Expanded Pool': '展开池',
+
+    // Errors
+    'no parent for {element} in {parent}': '在{parent}里，{element}没有父类',
+    'no shape type specified': '没有指定的形状类型',
+    'flow elements must be children of pools/participants': '流元素必须是池/参与者的子类',
+    'out of bounds release': 'out of bounds release',
+    'more than {count} child lanes': '子道大于{count} ',
+    'element required': '元素不能为空',
+    'diagram not part of bpmn:Definitions': '流程图不符合bpmn规范',
+    'no diagram to display': '没有可展示的流程图',
+    'no process or collaboration to display': '没有可展示的流程/协作',
+    'element {element} referenced by {referenced}#{property} not yet drawn': '由{referenced}#{property}引用的{element}元素仍未绘制',
+    'already rendered {element}': '{element} 已被渲染',
+    'failed to import {element}': '导入{element}失败',
+    'Id must be a valid QName.':'编号必须以字母或下划线开头',
+    'Element must have an unique id.':'元素必须具有唯一的id',
+
+    //属性面板的参数
+    'zjId': '自己编号',
+    'Id': '编号',
+    'Name': '名称',
+    'General': '常规',
+    'Details': '详情',
+    'Message Name': '消息名称',
+    'Message': '消息',
+    'Initiator': '创建者',
+    'Asynchronous Continuations': '持续异步',
+    'Asynchronous Before': '异步前',
+    'Asynchronous After': '异步后',
+    'Job Configuration': '工作配置',
+    'Exclusive': '排除',
+    'Job Priority': '工作优先级',
+    'Retry Time Cycle': '重试时间周期',
+    'Documentation': '文档',
+    'Element Documentation': '元素文档',
+    'History Configuration': '历史配置',
+    'History Time To Live': '历史的生存时间',
+    'Forms': '表单',
+    'Form Key': '表单key',
+    'Form Fields': '表单字段',
+    'Business Key': '业务key',
+    'Form Field': '表单字段',
+    'ID': '编号',
+    'Type': '类型',
+    'Label': '名称',
+    'Default Value': '默认值',
+    'Validation': '校验',
+    'Add Constraint': '添加约束',
+    'Config': '配置',
+    'Properties': '属性',
+    'Add Property': '添加属性',
+    'Value': '值',
+    'Listeners': '监听器',
+    'Execution Listener': '执行监听',
+    'Event Type': '事件类型',
+    'Listener Type': '监听器类型',
+    'Java Class': 'Java类',
+    'Expression': '表达式',
+    'Must provide a value': '必须提供一个值',
+    'Delegate Expression': '代理表达式',
+    'Script': '脚本',
+    'Script Format': '脚本格式',
+    'Script Type': '脚本类型',
+    'Inline Script': '内联脚本',
+    'External Script': '外部脚本',
+    'Resource': '资源',
+    'Field Injection': '字段注入',
+    'Extensions': '扩展',
+    'Input/Output': '输入/输出',
+    'Input Parameters': '输入参数',
+    'Output Parameters': '输出参数',
+    'Parameters': '参数',
+    'Output Parameter': '输出参数',
+    'Timer Definition Type': '定时器定义类型',
+    'Timer Definition': '定时器定义',
+    'Date': '日期',
+    'Duration': '持续',
+    'Cycle': '循环',
+    'Signal': '信号',
+    'Signal Name': '信号名称',
+    'Escalation': '升级',
+    'Error': '错误',
+    'Link Name': '链接名称',
+    'Condition': '条件名称',
+    'Variable Name': '变量名称',
+    'Variable Event': '变量事件',
+    'Specify more than one variable change event as a comma separated list.': '多个变量事件以逗号隔开',
+    'Wait for Completion': '等待完成',
+    'Activity Ref': '活动参考',
+    'Version Tag': '版本标签',
+    'Executable': '可执行文件',
+    'External Task Configuration': '扩展任务配置',
+    'Task Priority': '任务优先级',
+    'External': '外部',
+    'Connector': '连接器',
+    'Must configure Connector': '必须配置连接器',
+    'Connector Id': '连接器编号',
+    'Implementation': '实现方式',
+    'Field Injections': '字段注入',
+    'Fields': '字段',
+    'Result Variable': '结果变量',
+    'Topic': '主题',
+    'Configure Connector': '配置连接器',
+    'Input Parameter': '输入参数',
+    'Assignee': '代理人',
+    'Candidate Users': '候选用户',
+    'Candidate Groups': '候选组',
+    'Due Date': '到期时间',
+    'Follow Up Date': '跟踪日期',
+    'Priority': '优先级',
+    'The follow up date as an EL expression (e.g. ${someDate} or an ISO date (e.g. 2015-06-26T09:54:00)': '跟踪日期必须符合EL表达式，如： ${someDate} ,或者一个ISO标准日期，如：2015-06-26T09:54:00',
+    'The due date as an EL expression (e.g. ${someDate} or an ISO date (e.g. 2015-06-26T09:54:00)': '跟踪日期必须符合EL表达式，如： ${someDate} ,或者一个ISO标准日期，如：2015-06-26T09:54:00',
+    'Variables': '变量',
+    'Create DataObjectReference': '创建数据对象',
+    'Create Task': '创建任务',
+    'Create SendTask': '创建发送任务',
+    'Create ReceiveTask': '创建接收任务',
+    'Create UserTask': '创建用户任务',
+    'Create ManualTask': '创建手工任务',
+    'Create BusinessRuleTask': '创建业务规则任务',
+    'Create ServiceTask': '创建服务任务',
+    'Create ScriptTask': '创建脚本任务',
+    'Create CallActivityTask': '创建调用活动',
+    'Create SubProcessCollapsed': '创建子流程（折叠的）',
+    'Create SubProcessExpanded': '创建子流程（展开的）',
+    'Create StartEvent': '创建开始事件',
+    'Create EndEvent': '创建结束事件',
+    'Create DataStoreReference': '创建数据存储引用',
+    'Tasklist Configuration': '任务列表配置',
+    'Candidate Starter Configuration': '候选启动程序配置',
+    'Candidate Starter Groups': '候选启动组',
+    'Candidate Starter Users': '候选启动器用户',
+    'Specify more than one group as a comma separated list.':'将多个组指定为逗号分隔的列表。',
+    'Specify more than one user as a comma separated list.':'将多个用户指定为逗号分隔的列表。',
+    'This maps to the process definition key.':'映射到流程定义键。',
+    'Startable':'可启动',
+    'TextAnnotation':'文本批注',
+    'Append Intermediate/Boundary Event':'追加中间/边界事件',
+    'Append EndEvent':'附加事件',
+    'Append Gateway':'附加网关',
+    'Append Task':'追加任务',
+    'Parameter must have a name':'参数必须有名称',
+    'CallActivity Type':'调用活动类型',
+    'In Mapping':'在映射中',
+    'Out Mapping':'输出映射',
+    'Case Ref':'参考案例',
+    'Binding':'捆绑',
+    'Tenant Id':'机构ID',
+    'deployment':'调度。',
+    'Source':'来源',
+    'Target':'目标',
+    'Mapping must have a source':'映射必须有一个源',
+    'Mapping must have a target':'映射必须有一个目标',
+    'Task Listener':'任务侦听器',
+  };
+

web/src/view/process/guanli/layout.vue

@@ -0,0 +1,201 @@
+<template>
+  <div>
+    <div class="header">
+      <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="handleSelect">
+        <el-menu-item index="/layout/baseSetup" @click="to('/layout/baseSetup')">基础设置</el-menu-item>
+        <el-menu-item index="/layout/formDesign" @click="to('/layout/formDesign')">表单设计</el-menu-item>
+        <el-menu-item index="/layout/processDesign" @click="to('/layout/processDesign')">流程设计</el-menu-item>
+        <el-menu-item index="/layout/seniorSetup" @click="to('/layout/seniorSetup')">高级设置</el-menu-item>
+      </el-menu>
+      <div class="publish">
+        <el-button size="mini" @click="preview"><i class="el-icon-view"></i>预览</el-button>
+        <el-button size="mini" type="primary" @click="publish"><i class="el-icon-s-promotion"></i>发布</el-button>
+      </div>
+      <div class="back">
+        <el-button @click="exit" size="medium" icon="el-icon-arrow-left" circle></el-button>
+        <span>
+          <i :class="setup.icon" :style="'background:' + setup.background"></i>
+          <span>{{setup.name}}</span>
+        </span>
+      </div>
+    </div>
+
+    <el-dialog title="请使用手机扫码预览" :visible.sync="viewCode" width="300px" :close-on-click-modal="false" center>
+      <img src="../assets/image/code.png" width="250" height="250">
+    </el-dialog>
+
+    <div class="layout-body">
+      <transition name="router-fade" mode="out-in">
+        <router-view v-if="!$route.meta.keepAlive"/>
+      </transition>
+    </div>
+  </div>
+</template>
+
+<script>
+  // import {updateFormDetail, updateTemplate} from '@/api/setting'
+  
+  export default {
+    data() {
+      return {
+        activeIndex: '/layout/baseSetup',
+        viewCode: false,
+      };
+    },
+    computed:{
+      setup() {
+        return this.$store.state.template.baseSetup;
+      },
+      template() {
+        return this.$store.state.template;
+      }
+    },
+    created(){
+      this.check()
+    },
+    mounted() {
+			this.activeIndex = this.$route.path
+      console.log(document.body.offsetWidth)
+      if (document.body.offsetWidth <= 970){
+        this.$msgbox.alert("本设计器未适配中小屏幕，建议您在PC电脑端浏览器进行操作")
+      }
+      this.listener()
+    },
+    methods: {
+      publish() {
+        this.$confirm('您确定审批流程已配置完毕,并需要将其发布，发布后立即生效，是否继续?', '提示', {
+          confirmButtonText: '发布',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          console.log(this.setup)
+          let template = {
+            templateId: this.template.id,
+            templateName: this.setup.name,
+            icon: this.setup.icon,
+            group: this.setup.group,
+            background: this.setup.background,
+            whoCommit: JSON.stringify(this.setup.whoCommit.map(
+                    wc => {return {id: wc.id, type: wc.type, name: wc.name}})),
+            whoEdit: JSON.stringify(this.setup.whoEdit.map(
+                    wc => {return {id: wc.id, type: wc.type, name: wc.name}})),
+            whoExport: JSON.stringify(this.setup.whoExport.map(
+                    wc => {return {id: wc.id, type: wc.type, name: wc.name}})),
+            formItems: JSON.stringify(this.template.form),
+            remark: this.setup.remark,
+            process: JSON.stringify(this.template.process),
+          }
+          if (this.valid()){
+            // updateFormDetail(template).then(rsp => {
+            //   let isAdd = this.template.id === undefined
+            //   let params = {templateId: isAdd ? this.template.id:rsp.data,
+            //     type:'move', groupId: this.setup.group}
+            //   updateTemplate(params).then(rsp => {
+            //     this.$message.success(rsp.data)
+            //     this.$store.commit('clearTemplate')
+            //     this.$router.push('/formListPanel')
+            //   }).catch(err => this.$message.error(err.response.data))
+            // }).catch(err => this.$message.error(err.response.data))
+          }
+        })
+      },
+      preview() {
+        this.viewCode = true;
+      },
+      valid(){
+        if (!this.$isNotEmpty(this.setup.group)){
+          this.$message.warning('请选择分组')
+          this.$router.push('/layout/baseSetup')
+          return false;
+        }
+        return true;
+      },
+      exit(){
+        this.$confirm('未发布的内容将不会被保存，是否直接退出 ?', '提示', {
+          confirmButtonText: '退出',
+          cancelButtonText: '取消',
+          type: 'warning'
+        }).then(() => {
+          //sessionStorage.setItem('router-path','/formListPanel')
+          //window.location.reload()
+          this.$store.commit('clearTemplate')
+          this.$router.push('/formListPanel')
+        })
+      },
+      to(path) {
+        if (path !== this.$route.path){
+          this.$router.push(path);
+        }
+      },
+      handleSelect(key, keyPath) {
+        console.log(key, keyPath);
+      },
+      listener(){
+        window.onunload = this.closeBefore()
+        window.onbeforeunload = this.closeBefore()
+        //window.on('beforeunload',this.closeBefore())
+      },
+      closeBefore(){
+        //alert("您将要离开本页")
+        return false
+      },
+      check(){
+        if(this.$store.state.isEdit === null){
+          this.$router.push("/workPanel");
+        }
+      }
+    }
+  }
+</script>
+<style lang="less" scoped>
+  @import "@/assets/global";
+
+  .layout-body{
+    min-width: 980px;
+  }
+  
+  /deep/ .header {
+    min-width: 980px;
+    position: relative;
+    .el-menu {
+      top: 0;
+      z-index: 999;
+      display: flex;
+      justify-content: center;
+      width: 100%;
+    }
+
+    .publish {
+      position: absolute;
+      top: 15px;
+      right: 20px;
+      z-index: 1000;
+
+      i {
+        margin-right: 6px;
+      }
+
+      button {
+        border-radius: 15px;
+      }
+    }
+  
+    .back{
+      position: absolute;
+      z-index: 1000;
+      top: 10px;
+      left: 20px;
+      font-size: small;
+      span{
+        i{
+          border-radius: 10px;
+          padding: 7.8px;
+          font-size: 20px;
+          color: #ffffff;
+          margin: 0 10px;
+        }
+      }
+      
+    }
+  }
+</style>

web/src/view/process/guanli/qiantao.vue

@@ -0,0 +1,51 @@
+<template>
+  <div style="height:auto;">
+    <iframe style="width:100%;height:100%;" :src="bdTokenUrl" frameborder="0" scrolling="no" id="bdIframe">
+    </iframe>
+  </div>
+</template>
+ 
+<script type="text/javascript">
+ 
+ 
+export default {
+  name: 'turnoverfamily',
+  data(){
+    return{
+      bdTokenUrl : 'http://localhost:88/workPanel'
+    }
+  },
+  created() {
+    // this.getUrl();
+    this.$nextTick(()=>{
+        this.getCode();
+    });
+  },
+  mounted(){
+    /**
+     * iframe-宽高自适应显示   
+     */
+    const oIframe = document.getElementById('bdIframe');
+    const deviceWidth = document.documentElement.clientWidth;
+    const deviceHeight = document.documentElement.clientHeight;
+    oIframe.style.width = (Number(deviceWidth)-220) + 'px'; //数字是页面布局宽度差值
+    oIframe.style.height = (Number(deviceHeight)-120) + 'px'; //数字是页面布局高度差
+  },
+  methods: {
+    /**
+     * 获取-外部接口信息
+     */
+//     getUrl() {
+//         let that = this
+//         let bdUrl = {queryurl: this.$paths.bdpath+'/locate'};
+//         this.$api.getBdToken(bdUrl,function(res) {
+//             that.bdTokenUrl = res.data.data;
+//     })
+//   },
+}
+}
+</script>
+ 
+<style>
+ 
+</style>

web/src/view/process/index.vue

@@ -0,0 +1,17 @@
+<template>
+  <div>
+    <router-view v-slot="{ Component }">
+      <transition mode="out-in" name="el-fade-in-linear">
+        <keep-alive :include="$store.getters['router/keepAliveRouters']">
+          <component :is="Component" />
+        </keep-alive>
+      </transition>
+    </router-view>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'Process'
+}
+</script>

web/src/view/process/liuCheng1/bpmn.vue

@@ -0,0 +1,182 @@
+<template>
+  <div class="containers" ref="content">
+    <!-- 画布 -->
+    <div class="canvas" ref="canvas"></div>
+    <!-- 面板 -->
+    <div id="js-properties-panel" class="panel"></div>
+    <!-- 下载图 -->
+    <ul class="buttons">
+      <li>下载</li>
+      <li>
+        <a ref="saveDiagram" href="javascript:" title="下载BPMN图">BPMN图</a>
+      </li>
+      <li>
+        <a ref="saveSvg" href="javascript:" title="下载SVG图">SVG图</a>
+      </li>
+    </ul>
+  </div>
+</template>
+
+<script>
+// 引入组件
+import VueBpmn from "vue-bpmn";
+// 渲染器
+import BpmnModeler from "bpmn-js/lib/Modeler";
+// 左边工具栏
+import propertiesPanelModule from "bpmn-js-properties-panel";
+// 右边工具栏,扩展属性
+import propertiesProviderModule from "bpmn-js-properties-panel/lib/provider/camunda";
+import camundaModdleDescriptor from "camunda-bpmn-moddle/resources/camunda";
+
+export default {
+  components: {
+    
+  },
+  data() {
+    return {
+      // bpmn建模器
+      bpmnModeler: null,
+      container: null,
+      canvas: null,
+      xmlStr: null,
+      processName: ""
+    };
+  },
+  mounted() {
+	
+    // 获取到属性ref为“content”的dom节点
+    this.container = this.$refs.content;
+    // 获取到属性ref为“canvas”的dom节点
+    const canvas = this.$refs.canvas;
+     // 建模，官方文档这里讲的很详细
+    this.bpmnModeler = new BpmnModeler({
+      container: canvas,
+      // 添加控制板
+      // propertiesPanel: {
+      //   parent: '#js-properties-panel'
+      // },
+      additionalModules: [
+        // 左边工具栏以及节点
+        propertiesProviderModule,
+        // 右边的工具栏
+        propertiesPanelModule
+      ],
+      moddleExtensions: {
+        camunda: camundaModdleDescriptor
+      }
+    });
+
+     // 下载画图
+    let _this = this
+    // 获取a标签dom节点
+    const downloadLink = this.$refs.saveDiagram
+    const downloadSvgLink = this.$refs.saveSvg
+	  const modeler = new BpmnModeler({container: '#modeler'})
+    // 给图绑定事件，当图有发生改变就会触发这个事件
+    modeler.on('commandStack.changed', function () {
+      _this.saveSVG(function (err, svg) {
+        _this.setEncoded(downloadSvgLink, 'diagram.svg', err ? null : svg)
+      })
+      // 保存图
+      _this.saveDiagram(function (err, xml) {
+        _this.setEncoded(downloadLink, 'diagram.bpmn', err ? null : xml)
+      })
+    })
+    // 创建新图
+    this.createNewDiagram(this.bpmnModeler)
+    
+  },
+  methods: {
+    createNewDiagram() {
+      const bpmnXmlStr =
+        '<?xml version="1.0" encoding="UTF-8"?>\n' +
+        '<bpmn2:definitions xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:bpmn2="http://www.omg.org/spec/BPMN/20100524/MODEL" xmlns:bpmndi="http://www.omg.org/spec/BPMN/20100524/DI" xmlns:dc="http://www.omg.org/spec/DD/20100524/DC" xmlns:di="http://www.omg.org/spec/DD/20100524/DI" xsi:schemaLocation="http://www.omg.org/spec/BPMN/20100524/MODEL BPMN20.xsd" id="sample-diagram" targetNamespace="http://bpmn.io/schema/bpmn">\n' +
+        '  <bpmn2:process id="Process_1" isExecutable="false">\n' +
+        '    <bpmn2:startEvent id="StartEvent_1"/>\n' +
+        "  </bpmn2:process>\n" +
+        '  <bpmndi:BPMNDiagram id="BPMNDiagram_1">\n' +
+        '    <bpmndi:BPMNPlane id="BPMNPlane_1" bpmnElement="Process_1">\n' +
+        '      <bpmndi:BPMNShape id="_BPMNShape_StartEvent_2" bpmnElement="StartEvent_1">\n' +
+        '        <dc:Bounds height="36.0" width="36.0" x="412.0" y="240.0"/>\n' +
+        "      </bpmndi:BPMNShape>\n" +
+        "    </bpmndi:BPMNPlane>\n" +
+        "  </bpmndi:BPMNDiagram>\n" +
+        "</bpmn2:definitions>";
+      // 将字符串转换成图显示出来
+      this.bpmnModeler.importXML(bpmnXmlStr, function(err) {
+        if (err) {
+          console.error(err);
+        }
+      });
+    },
+    // 下载为SVG格式,done是个函数，调用的时候传入的
+    saveSVG(done) {
+      // 把传入的done再传给bpmn原型的saveSVG函数调用
+      this.bpmnModeler.saveSVG(done);
+    },
+    // 下载为SVG格式,done是个函数，调用的时候传入的
+    saveDiagram(done) {
+      // 把传入的done再传给bpmn原型的saveXML函数调用
+      this.bpmnModeler.saveXML({ format: true }, function(err, xml) {
+        done(err, xml);
+      });
+    },
+    // 当图发生改变的时候会调用这个函数，这个data就是图的xml
+    setEncoded(link, name, data) {
+      // 把xml转换为URI，下载要用到的
+      const encodedData = encodeURIComponent(data);
+      // 获取到图的xml，保存就是把这个xml提交给后台
+      this.xmlStr = data;
+      // 下载图的具体操作,改变a的属性，className令a标签可点击，href令能下载，download是下载的文件的名字
+      if (data) {
+        link.className = "active";
+        link.href = "data:application/bpmn20-xml;charset=UTF-8," + encodedData;
+        link.download = name;
+      }
+    }
+  }
+};
+</script>
+
+<style scoped lang="scss">
+// 最外层容器
+.containers{
+    position: absolute;
+    background-color: #ffffff;
+    width: 100%;
+    height: 100%;
+  }
+  // 画布
+  .canvas{
+    width: 100%;
+    height: 100%;
+  }
+  // 面板
+  .panel{
+    position: absolute;
+    right: 0;
+    top: 0;
+    width: 300px;
+  }
+  // 下载按钮
+  .buttons{
+    position: absolute;
+    left: 20px;
+    bottom: 20px;
+    &>li{
+      display:inline-block;margin: 5px;
+      &>a{
+        color: #999;
+        background: #eee;
+        cursor: not-allowed;
+        padding: 8px;
+        border: 1px solid #ccc;
+        &.active{
+          color: #333;
+          background: #fff;
+          cursor: pointer;
+        }
+      }
+    }
+  }
+</style>

web/src/view/process/liucheng/config/BackgroundConfig.js

@@ -0,0 +1,23 @@
+/*explain：背景配置;@author: wxm; @version: 1.0; date: 2021/5/19;*/
+export const BackgroundConfig = {
+   // image:"https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=2920685919,2017597770&fm=26&gp=0.jpg",
+    opacity:0.2,
+    size:"100%",
+    repeat:"no-repeat",
+}
+
+// export type BackgroundConfig = {
+//     image?: string; // 背景图片地址
+//     color?: string; // 背景色
+//     repeat?: string; // 背景图片重复
+//     position?: string; // 背景图片位置
+//     size?: string; // 背景图片尺寸
+//     opacity?: number; // 背景透明度 1-0
+// };
+
+// repeat
+// repeat	默认。背景图像将在垂直方向和水平方向重复。
+// repeat-x	背景图像将在水平方向重复。
+// repeat-y	背景图像将在垂直方向重复。
+// no-repeat	背景图像将仅显示一次。
+// inherit	规定应该从父元素继承 background-repeat 属性的设置。

web/src/view/process/liucheng/config/GridOptionsConfig.js

@@ -0,0 +1,18 @@
+/*explain：网格配置;@author: wxm; @version: 1.0; date: 2021/5/19;*/
+export const GridOptionsConfig = {
+    size:20,
+    visible:true,
+    type:'dot',
+    config:{
+        color:'Black',
+        thickness:1,
+    }
+}
+
+// size?: number // 栅格
+// visible?: boolean, // 是否可见，false则隐藏网格线但是保留栅格效果
+// type?: 'dot' | 'mesh', // 网格样式，目前内置支持点状'dot'和网格'mesh'
+// config?: {
+//     color: string, // 网格颜色
+//     thickness?: number, // 网格线宽度
+// }

web/src/view/process/liucheng/config/StyleConfig.js

@@ -0,0 +1,35 @@
+/*explain：组件样式配置;@author: wxm; @version: 1.0; date: 2021/5/19;*/
+export const StyleConfig = {
+    rect: { // 矩形样式
+        width: 100,
+        height: 50,
+        radius: 6,
+        fill: '#34415b',
+        strokeWidth: 0
+    },
+    circle: { // 圆形样式
+        r: 40,
+        fill: '#34415b',
+        strokeWidth: 0
+    },
+    ellipse: { //椭圆样式
+        fill: '#34415b',
+    },
+    polygon: { //多边形样式
+        fill: '#34415b',
+    },
+    text: { //文本样式
+        fill: '#34415b',
+    },
+    nodeText: { // 节点文本样式
+        fontSize: 16,
+        //color: '#ffffff'
+    },
+    edgeText: { // 边文本样式
+        fontSize: 16,
+        color: '#34415b'
+    },
+    anchor: { // 锚点样式
+        fill: "#6edd97"
+    }
+}

web/src/view/process/liucheng/liucheng.vue

@@ -0,0 +1,357 @@
+<!--@author: wxm; @version: 1.0; date: 2021/5/15;-->
+<template>
+    <div id="app">
+        <el-container style="height: 100%">
+            <!--工具栏-->
+<!--            <el-header style="position: absolute;right: 0;top:20px;height: 40px; z-index: 101;">-->
+<!--                <el-button @click="methods.zoom(true)">放大</el-button>-->
+<!--                <el-button @click="methods.zoom(false)">缩小</el-button>-->
+<!--                <el-button @click="methods.resetZoom()">还原大小</el-button>-->
+<!--                <el-button @click="methods.focusOn()">位置还原</el-button>-->
+                <el-button @click="methods.getGraphData()">获取数据</el-button>
+<!--                <el-button @click="methods.undo()">上一步</el-button>-->
+<!--                <el-button @click="methods.redo()">下一步</el-button>-->
+<!--            </el-header>-->
+            <el-button @click="methods.downloadImg()">下载</el-button>
+
+
+
+            <el-container style="height: 100%">
+                <!--组件栏-->
+                <div class="node-panel">
+                    <div class="node-item" @mousedown='methods.mouseDownHandle(item)' v-for="(item,index) in shapeList" :key="index">
+                        <div class="node-item-icon" :class="item.class">
+                            <span class="node-label">{{item.text}}</span>
+                        </div>
+                    </div>
+                </div>
+
+                <!--内容区-->
+                <el-main id="graph" style="height: 100%;"></el-main>
+            </el-container>
+        </el-container>
+    </div>
+</template>
+
+<script>
+import {toRefs,reactive,onMounted} from 'vue'
+
+import LogicFlow from '@logicflow/core';
+import '@logicflow/core/dist/style/index.css';
+//插件库
+import { NodeResize, Menu  } from '@logicflow/extension';
+import '@logicflow/extension/lib/style/index.css'
+
+// 右键菜单
+LogicFlow.use(Menu);
+
+//节点缩放
+// 样式不要
+// NodeResize.style.outline = {
+//     style: {
+//         outline: {
+//             stroke: '#000000',
+//             strokeWidth: 1,
+//             strokeDasharray: '3,3',
+//         },
+//         controlPoint: {
+//             width: 7,
+//             height: 7,
+//             fill: '#FFFFFF',
+//             stroke: '#000000',
+//         },
+//     },
+//     ...NodeResize.style.outline,
+//     stroke: '#1E90FF',
+//     strokeDasharray: '',
+// }
+LogicFlow.use(NodeResize);
+NodeResize.step = 4;
+LogicFlow.use(NodeResize);
+
+//框选
+import {SelectionSelect} from '@logicflow/extension';
+LogicFlow.use(SelectionSelect);
+//SelectionSelect.open(); 此事件无效
+
+//迷你地图
+// import {MiniMap} from '@logicflow/extension';
+// LogicFlow.use(MiniMap);
+
+//控制面板
+// import {Control} from '@logicflow/extension';
+// LogicFlow.use(Control )
+
+//图片导出
+import { Snapshot } from '@logicflow/extension';
+LogicFlow.use(Snapshot);
+
+
+import {BackgroundConfig} from './config/BackgroundConfig'
+import {GridOptionsConfig} from './config/GridOptionsConfig'
+import {StyleConfig} from './config/StyleConfig'
+
+import {registerMyRectNodeModel} from './node/myRectNode'
+
+export default {
+    name: 'App',
+    components:{
+    },
+    setup(){
+        onMounted(()=>{
+            methods.init();
+            window.onkeydown = function (){
+                let key = window.event.keyCode;
+                if (key === 46) {
+                    methods.deleteNode();
+                }
+                console.log(key)
+            }
+        });
+        const data = reactive({
+            lf:null,
+            logicFlowData:{
+                nodes:[
+                    {id: 1,type: 'rect', x: 400, y: 400, text: '矩形节点',width:200,height:200,},
+                    {id: 2,type: 'circle', x: 120, y: 80, text: {value: '圆形节点',x: 120, y: 80,},},
+                    {id: 3,type: 'ellipse', x: 200, y: 310, text: '椭圆节点',},
+                    {id: 5,type: 'ellipse', x: 250, y: 310, text: '椭圆节点',},
+                    {id: 4,type: 'my-rect', x: 250, y: 500, text: '自定义',},
+                ]
+            },
+            shapeList: [
+                {type: 'rect', text: '矩形',class:'node-rect'},
+                {type: 'diamond', text: '菱形',class:'node-diamond'},
+                {type: 'circle', text: '圆形',class:'node-circle'},
+                {type: 'ellipse', text: '椭圆',class:'node-ellipse'},
+                {type: 'my-rect', text: '自定义',class:'node-rect'},
+                // {type: 'chatBubble', text: 'chatBubble',class:'node-polygon'},
+                // {type: 'text=1', text: 'text=1',class:'node-polygon'},
+            ],
+            clickNodeId:'',
+            clickEdgeId:'',
+        });
+        const methods = {
+            /**
+             *  初始化画板
+             */
+            init : function () {
+                data.lf = new LogicFlow({
+                    // 容器配置
+                    container: document.querySelector('#graph'),
+                    background: BackgroundConfig,
+                    grid: GridOptionsConfig,
+                    textEdit: true, //是否开启文本编辑
+                    isSilentMode: false, //仅浏览不可编辑模式，默认不开启
+                    edgeType: 'polyline', //line 直线 polyline 折线 bezier 贝塞尔曲线
+                    snapline: true, //是否启用节点辅助对齐线
+                    style: StyleConfig,//样式
+                    keyboard: {//cv快捷键
+                        enabled: true
+                    },
+                    metaKeyMultipleSelected:true,//metaKeyMultipleSelected	Boolean	false	-	是否开启功能键按住多选
+                });
+
+                //注册自定义组件
+                methods.registerNode();
+                data.lf.render(data.logicFlowData);
+                //监听事件
+                methods.monitorEvent();
+
+                //开启多选模式
+                data.lf.updateEditConfig({
+                    stopMoveGraph: true
+                })
+
+                //开启地图
+                //MiniMap.show(1000,100);
+            },
+
+            /**
+             * 注册自定义组件
+             **/
+            registerNode : function(){
+                registerMyRectNodeModel(data.lf);
+            },
+
+            /**
+             * 拖拽
+             * @param item 拖拽属性
+             */
+            mouseDownHandle : function (item) {
+                //生成ID
+                let id = data.logicFlowData.nodes[data.logicFlowData.nodes.length -1].id + 1;
+                console.log(item,id)
+                data.lf.dnd.startDrag({
+                    id: id.toString(),
+                    type:item.type,
+                    text:item.text,
+                    properties:{}
+                });
+            },
+
+            // 放大或缩小画布 isZoomIn:boolean
+            zoom : function (isZoomIn){
+                data.lf.zoom(isZoomIn);
+            },
+            //还原
+            resetZoom : function (){
+                data.lf.resetZoom();
+            },
+            //等比缩小 size:number
+            setZoomMiniSize :function(size){
+                data.lf.setZoomMiniSize(size)
+            },
+            //等比放大 size:number
+            setZoomMaxSize : function (size){
+                data.lf.setZoomMaxSize(size);
+            },
+
+            // 将图形移动到画布中心 focusOnArgs:{id:"内容ID",coordinate: {x: 11,y: 22}}
+            focusOn : function (){
+                data.lf.focusOn({coordinate: {x: 180,y: 280}});
+            },
+
+            //返回值，如果是应用了adapter插件，且设置为adapterOut，返回为转换后的数据格式，否则为默认的格式
+            getGraphData : function (){
+                console.log(data.lf.getGraphData())
+            },
+
+            //撤销一步
+            undo : function (){
+                data.lf.undo();
+            },
+
+            // 向前一步
+            redo : function (){
+                data.lf.redo();
+            },
+
+            //监听事件
+            monitorEvent : function (){
+                //点击节点将 节点ID记录下来
+                data.lf.on('element:click', (callback) => {
+                    console.log('节点/线点击事件：' + 'element:click',callback)
+                    //有连线起始节点的id 说明是线
+                    if (callback.data.sourceNodeId){
+                        data.clickEdgeId = callback.data.id;
+                        //清除节点的
+                        data.clickNodeId = '';
+                    }else{
+                        data.clickNodeId = callback.data.id;
+                        //清除线
+                        data.clickEdgeId = '';
+                    }
+                })
+
+                //点击画板 将记录下来的节点和线ID进行删除
+                data.lf.on('blank:mousedown',() =>{
+                    console.log('画板点击事件：' + 'blank:mousedown')
+                    data.clickNodeId = ''
+                    data.clickEdgeId = ''
+                })
+            },
+
+            //删除节点
+            deleteNode : function (){
+                if (data.clickNodeId){
+                    console.log("删除节点")
+                    data.lf.deleteNode(data.clickNodeId);
+                    //重置data.clickDataId
+                    data.clickNodeId = null;
+                }else if (data.clickEdgeId){
+                    console.log("删除线")
+                    data.lf.deleteEdge(data.clickEdgeId);
+                    //重置data.clickEdgeId
+                    data.clickEdgeId = '';
+                }else{
+                    console.log("批量删除");
+                }
+            },
+
+            //下载图片
+            downloadImg : function (){
+                data.lf.getSnapshot()
+            }
+
+        }
+        return {
+            ...toRefs(data),
+            methods,
+        }
+    },
+}
+</script>
+
+<style>
+>>>.el-main{
+    padding: 10px;
+    margin: 0;
+}
+#app {
+    height: 100%;
+    margin: 0;
+    padding: 0;
+}
+.node-panel {
+    width: 70px;
+    padding: 20px 0;
+    background-color: white;
+    box-shadow: 0 0 10px 1px rgb(228, 224, 219);
+    border-radius: 6px;
+    text-align: center;
+    z-index: 101;
+}
+.node-item {
+    margin-bottom: 20px;
+}
+.node-item-icon {
+    width: 30px;
+    height: 30px;
+    margin-left: 20px;
+    background-size: cover;
+    text-align: center;
+}
+.node-label {
+    font-size: 12px;
+    margin-top: 5px;
+    user-select: none;
+}
+.node-rect{
+    width: 40px;
+    height: 30px;
+    border: 2px solid black;
+}
+.node-circle{
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+    border: 2px solid black;
+}
+.node-ellipse{
+    border: 2px solid black;
+    border-radius: 60%;
+    width: 40px;
+    height: 30px;
+}
+.node-polygon{
+    width: 40px;
+    height: 40px;
+    border: 2px solid black;
+    transform:rotate(45deg);
+}
+.node-diamond{
+    width: 40px;
+    height: 40px;
+    border: 2px solid black;
+    transform:rotate(45deg);
+}
+/*css 设置*/
+.lf-menu-delete .lf-menu-item-icon{
+    display: inline-block;
+    width: 20px;
+    height: 20px;
+    background: url('./img/delete.jpg') no-repeat;
+    background-size: 20px;
+}
+</style>

web/src/view/process/liucheng/node/myRectNode.js

@@ -0,0 +1,84 @@
+/*explain：;@author: wxm; @version: 1.0; date: 2021/6/9;*/
+import { h } from '@logicflow/core';
+import { RectResize } from '@logicflow/extension';
+
+// 自定义节点的 model
+class Model extends RectResize.model{
+    //自定义节点的样式
+    setAttributes() {
+        const size = 100;
+        this.width = size; //width	number	✅	节点宽度
+        this.height = size; //height	number	✅	节点高度
+        this.fill = '#5F9EA0'; //fill	color	✅	节点填充颜色
+        this.fillOpacity = 1; //fillOpacity	number	✅	节点填充颜色透明度
+        this.stroke = "#588811"; // stroke	color	✅	节点边框颜色
+        this.strokeOpacity = 1; //strokeOpacity	number	✅	节点边框颜色透明度
+        this.strokeWidth = 1; // strokeWidth	number	✅	节点边框宽度
+        this.opacity = 1; //opacity	number	✅	节点整体透明度
+        this.outlineColor = '#00008B' //outlineColor	color	✅	外框颜色
+        this.hoverOutlineColor = '#008000' // hoverOutlineColor	color	✅	hover外边框颜色
+        this.outlineStrokeDashArray = ''; //控制用来描外边框的点划线的图案范式, 设置为空是为实线
+        this.hoverOutlineStrokeDashArray = ''; //控制用来描hover外边框的点划线的图案范式, 设置为空是为实线
+
+        //矩形节点特有
+        this.radius = 5;//radius	number	✅	矩形圆角
+
+        //矩形节点特有
+        this.radius = 5;//radius	number	✅	矩形圆角
+
+        // 设置自定义锚点
+        // 只需要为每个锚点设置相对于节点中心的偏移量
+        this.anchorsOffset = [
+            [size / 2, 0], // x 轴上偏移 size / 2
+            [-size / 2, 0], // x 轴上偏移 -size / 2
+        ];
+    }
+    //设置连线规则
+    getConnectedTargetRules() {
+        const rules = super.getConnectedTargetRules();
+        const notAsTarget = {
+            message: '禁止自己连自己',
+            validate: (source,target) => {
+                return source.id !== target.id;
+            },
+        };
+        rules.push(notAsTarget);
+        return rules;
+    }
+}
+
+// 自定义节点的 view
+class View extends RectResize.view{
+    getResizeShape() {
+        // 通过 getAttributes 获取 model 中的属性
+        const { x, y, width, height, fill, stroke, strokeWidth, radius } = this.getAttributes();
+        const attrs = {
+            // rect 标签的 x，y 对应的是图形的左上角
+            // 所以我们要将矩形的中心移动到 x，y
+            x: x - width / 2,
+            y: y - height / 2,
+            width,
+            height,
+            stroke,
+            fill,
+            strokeWidth,
+            rx: radius,
+            ry: radius,
+        }
+        // getShape 的返回值是一个通过 h 方法创建的 svg 元素
+        return h("g", {}, [
+                h("rect", { ...attrs }),
+                h(
+                    'svg',
+                    {x: x - width / 2 + 5, y: y - height / 2 + 5, width: 25, height: 25, viewBox: "0 0 1274 1024",},
+                    h('path', {fill: stroke, d: "M655.807326 287.35973m-223.989415 0a218.879 218.879 0 1 0 447.978829 0 218.879 218.879 0 1 0-447.978829 0ZM1039.955839 895.482975c-0.490184-212.177424-172.287821-384.030443-384.148513-384.030443-211.862739 0-383.660376 171.85302-384.15056 384.030443L1039.955839 895.482975z"})
+                ),
+            ]
+        );
+
+    }
+}
+
+export function registerMyRectNodeModel(lf){
+    lf.register({type:"my-rect",view:View,model:Model})
+}

web/yarn.lock

@@ -977,6 +977,24 @@
     "cssnano-preset-default" "^4.0.0"
     "postcss" "^7.0.0"
 
+"@logicflow/core@^0.4.13", "@logicflow/core@^0.4.15":
+  "integrity" "sha512-JtgRL/ZM+FjjibrOkswkuKzeX3XMnozmq/h0YC/HBRpv0ZHynrlCQGqI1SQsD3tDIkaN4wBnHM9DIqIIwf7ZBQ=="
+  "resolved" "https://registry.npmjs.org/@logicflow/core/-/core-0.4.15.tgz"
+  "version" "0.4.15"
+  dependencies:
+    "@types/mousetrap" "^1.6.4"
+    "mousetrap" "^1.6.5"
+    "preact" "^10.4.8"
+
+"@logicflow/extension@^0.4.13":
+  "integrity" "sha512-J6BRp5ZpOY/kyQmT8eCiLM+y+OWKClNDpWmiVSYdp0Rr8fGH1U4A8ITYvcte45nXorHLcg659PdHZaYqZtzJog=="
+  "resolved" "https://registry.npmjs.org/@logicflow/extension/-/extension-0.4.15.tgz"
+  "version" "0.4.15"
+  dependencies:
+    "@logicflow/core" "^0.4.15"
+    "ids" "^1.0.0"
+    "preact" "^10.4.8"
+
 "@mrmlnc/readdir-enhanced@^2.2.1":
   "integrity" "sha1-UkryQNGjYFJ7cwR17PoTRKpUDd4="
   "resolved" "https://registry.npm.taobao.org/@mrmlnc/readdir-enhanced/download/@mrmlnc/readdir-enhanced-2.2.1.tgz"
@@ -1079,7 +1097,7 @@
   dependencies:
     "@types/node" "*"
 
-"@types/json-schema@^7.0.5":
+"@types/json-schema@^7.0.5", "@types/json-schema@^7.0.8":
   "integrity" "sha1-l+3JA36gw4WFMgsolk3eOznkZg0="
   "resolved" "https://registry.nlark.com/@types/json-schema/download/@types/json-schema-7.0.9.tgz?cache=0&sync_timestamp=1629708189890&other_urls=https%3A%2F%2Fregistry.nlark.com%2F%40types%2Fjson-schema%2Fdownload%2F%40types%2Fjson-schema-7.0.9.tgz"
   "version" "7.0.9"
@@ -1099,6 +1117,11 @@
   "resolved" "https://registry.nlark.com/@types/minimist/download/@types/minimist-1.2.2.tgz?cache=0&sync_timestamp=1629708337116&other_urls=https%3A%2F%2Fregistry.nlark.com%2F%40types%2Fminimist%2Fdownload%2F%40types%2Fminimist-1.2.2.tgz"
   "version" "1.2.2"
 
+"@types/mousetrap@^1.6.4":
+  "integrity" "sha512-zTqjvgCUT5EoXqbqmd8iJMb4NJqyV/V7pK7AIKq7qcaAsJIpGlTVJS1HQM6YkdHCdnkNSbhcQI7MXYxFfE3iCA=="
+  "resolved" "https://registry.npmjs.org/@types/mousetrap/-/mousetrap-1.6.8.tgz"
+  "version" "1.6.8"
+
 "@types/node@*":
   "integrity" "sha1-xrkZgXjaUE38of0L6bLhAC8VhvA="
   "resolved" "https://registry.nlark.com/@types/node/download/@types/node-16.7.1.tgz"
@@ -1782,7 +1805,7 @@
   "resolved" "https://registry.npm.taobao.org/ajv-keywords/download/ajv-keywords-3.5.2.tgz?cache=0&sync_timestamp=1616882441894&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fajv-keywords%2Fdownload%2Fajv-keywords-3.5.2.tgz"
   "version" "3.5.2"
 
-"ajv@^6.1.0", "ajv@^6.10.0", "ajv@^6.10.2", "ajv@^6.12.3", "ajv@^6.12.4", "ajv@^6.9.1", "ajv@>=5.0.0":
+"ajv@^6.1.0", "ajv@^6.10.0", "ajv@^6.10.2", "ajv@^6.12.3", "ajv@^6.12.4", "ajv@^6.12.5", "ajv@^6.9.1", "ajv@>=5.0.0":
   "integrity" "sha1-uvWmLoArB9l3A0WG+MO69a3ybfQ="
   "resolved" "https://registry.nlark.com/ajv/download/ajv-6.12.6.tgz"
   "version" "6.12.6"
@@ -2265,6 +2288,58 @@
   "resolved" "https://registry.npm.taobao.org/boolbase/download/boolbase-1.0.0.tgz"
   "version" "1.0.0"
 
+"bpmn-font@^0.9.3":
+  "integrity" "sha512-kzRGXGLzTROLRNCSskkOyj/+SbtTAn2unKfgB9tNt7RWJFybg/Wbe9YjK2ALotI3b64wwlCTkAalXiTiskP6dg=="
+  "resolved" "https://registry.npmjs.org/bpmn-font/-/bpmn-font-0.9.3.tgz"
+  "version" "0.9.3"
+
+"bpmn-js-properties-panel@^0.32.2":
+  "integrity" "sha512-nf2fFZUJfoChcKiiSvLJwutbnU0l/gPl2CopxisJo4dbZ7vYbqPnG/FYVU1MgYD6y+FtOxF2pGljd8wA+IYdmw=="
+  "resolved" "https://registry.npmjs.org/bpmn-js-properties-panel/-/bpmn-js-properties-panel-0.32.2.tgz"
+  "version" "0.32.2"
+  dependencies:
+    "ids" "^1.0.0"
+    "inherits" "^2.0.1"
+    "lodash" "^4.17.15"
+    "min-dom" "^3.1.1"
+    "scroll-tabs" "^1.0.1"
+    "selection-update" "^0.1.2"
+
+"bpmn-js@^3.x || ^4.x", "bpmn-js@^4.0.4", "bpmn-js@^6.x || ^7.x || ^8.x":
+  "integrity" "sha512-LEKusdwTwgWk5YGjA6mxecpaa2AAKOBbhWCwA5e7mYJ6T+/A9gCjTmbGPtq5rQQVjdLO4pt5kVEOolrRJMd32g=="
+  "resolved" "https://registry.npmjs.org/bpmn-js/-/bpmn-js-4.0.4.tgz"
+  "version" "4.0.4"
+  dependencies:
+    "bpmn-font" "^0.9.3"
+    "bpmn-moddle" "^5.2.0"
+    "css.escape" "^1.5.1"
+    "diagram-js" "^4.0.3"
+    "diagram-js-direct-editing" "^1.5.0"
+    "ids" "^1.0.0"
+    "inherits" "^2.0.1"
+    "min-dash" "^3.5.0"
+    "min-dom" "^3.0.0"
+    "object-refs" "^0.3.0"
+    "tiny-svg" "^2.2.1"
+
+"bpmn-moddle@^5.2.0":
+  "integrity" "sha512-MZTlpIXWcHTelp09vR4hs23diCdeHl4JbwOXGmif10qf9v/kqreiCMeo0B9w8eEmZqdRdkulTIScKavTYOxTQw=="
+  "resolved" "https://registry.npmjs.org/bpmn-moddle/-/bpmn-moddle-5.2.0.tgz"
+  "version" "5.2.0"
+  dependencies:
+    "min-dash" "^3.0.0"
+    "moddle" "^4.1.0"
+    "moddle-xml" "^7.5.0"
+
+"bpmn-moddle@^6.0.0":
+  "integrity" "sha512-MD649c7/I7+AKl3OGLs8ed8guzKuIRIJhOvLeVBSyCHtd41iB8ZRi+NL2UeC8pNgpqcjMsZG3ye++x3fh6MQ+g=="
+  "resolved" "https://registry.npmjs.org/bpmn-moddle/-/bpmn-moddle-6.0.7.tgz"
+  "version" "6.0.7"
+  dependencies:
+    "min-dash" "^3.0.0"
+    "moddle" "^5.0.1"
+    "moddle-xml" "^8.0.8"
+
 "brace-expansion@^1.1.7":
   "integrity" "sha1-PH/L9SnYcibz0vUrlm/1Jx60Qd0="
   "resolved" "https://registry.npm.taobao.org/brace-expansion/download/brace-expansion-1.1.11.tgz"
@@ -2532,6 +2607,13 @@
   "resolved" "https://registry.npm.taobao.org/camelcase/download/camelcase-6.2.0.tgz"
   "version" "6.2.0"
 
+"camunda-bpmn-moddle@^6.1.1":
+  "integrity" "sha512-HbYXm9lNPVnGfq4jRRtvR4YgRgw6hGwJ2wFIBghyOQ8fYsqUAPAZ4MJ1pQASZM+XpxmEyRTowc4SiHcAcFbDYw=="
+  "resolved" "https://registry.npmjs.org/camunda-bpmn-moddle/-/camunda-bpmn-moddle-6.1.1.tgz"
+  "version" "6.1.1"
+  dependencies:
+    "min-dash" "^3.5.2"
+
 "caniuse-api@^3.0.0":
   "integrity" "sha1-Xk2Q4idJYdRikZl99Znj7QCO5MA="
   "resolved" "https://registry.npm.taobao.org/caniuse-api/download/caniuse-api-3.0.0.tgz"
@@ -2851,6 +2933,11 @@
   "resolved" "https://registry.npm.taobao.org/component-emitter/download/component-emitter-1.3.0.tgz"
   "version" "1.3.0"
 
+"component-event@^0.1.4":
+  "integrity" "sha1-PeePwoeCOBeH4kvyp8U2vwFCybQ="
+  "resolved" "https://registry.npmjs.org/component-event/-/component-event-0.1.4.tgz"
+  "version" "0.1.4"
+
 "compressible@~2.0.16":
   "integrity" "sha1-r1PMprBw1MPAdQ+9dyhqbXzEb7o="
   "resolved" "https://registry.npm.taobao.org/compressible/download/compressible-2.0.18.tgz"
@@ -3188,6 +3275,11 @@
   "resolved" "https://registry.nlark.com/css-what/download/css-what-5.0.1.tgz"
   "version" "5.0.1"
 
+"css.escape@^1.5.1":
+  "integrity" "sha1-QuJ9T6BK4y+TGktNQZH6nN3ul8s="
+  "resolved" "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz"
+  "version" "1.5.1"
+
 "cssesc@^3.0.0":
   "integrity" "sha1-N3QZGZA7hoVl4cCep0dEXNGJg+4="
   "resolved" "https://registry.npm.taobao.org/cssesc/download/cssesc-3.0.0.tgz"
@@ -3463,6 +3555,54 @@
   "resolved" "https://registry.nlark.com/detect-node/download/detect-node-2.1.0.tgz"
   "version" "2.1.0"
 
+"diagram-js-direct-editing@^1.5.0":
+  "integrity" "sha512-OwDpK4cNJ4QYuV855HvtZcB9/krfZRQ80uaE6bwaKbyb4584sD7nCtR5yWOyhJx4dIh1gMoqhF7d7G57M4tQVQ=="
+  "resolved" "https://registry.npmjs.org/diagram-js-direct-editing/-/diagram-js-direct-editing-1.6.3.tgz"
+  "version" "1.6.3"
+  dependencies:
+    "min-dash" "^3.5.2"
+    "min-dom" "^3.1.3"
+
+"diagram-js@^0.x || ^1.x || ^2.x || ^3.x || ^4.x || ^5.x || ^6.x || ^7.x", "diagram-js@^5.x || ^6.x || ^7.x":
+  "integrity" "sha512-Ziy5vTmB8V/kxuhgxQXdnNxSYnqlWxFrBih37MOOglDzyQ5mBIA8tFNssp/ncHpZmhTGC8sb54lYknovzyrrzg=="
+  "resolved" "https://registry.npmjs.org/diagram-js/-/diagram-js-7.8.1.tgz"
+  "version" "7.8.1"
+  dependencies:
+    "css.escape" "^1.5.1"
+    "didi" "^5.2.1"
+    "hammerjs" "^2.0.1"
+    "inherits" "^2.0.4"
+    "min-dash" "^3.5.2"
+    "min-dom" "^3.1.3"
+    "object-refs" "^0.3.0"
+    "path-intersection" "^2.2.1"
+    "tiny-svg" "^2.2.2"
+
+"diagram-js@^4.0.3":
+  "integrity" "sha512-BzcWUEnRfO2tpdc8XHvG/wsX+GrE/7qGRDf1khn5b0UrzrqqLhj1yiguvpgb0rQSTPeBtkot6PUA4wB2QAQutA=="
+  "resolved" "https://registry.npmjs.org/diagram-js/-/diagram-js-4.0.3.tgz"
+  "version" "4.0.3"
+  dependencies:
+    "css.escape" "^1.5.1"
+    "didi" "^4.0.0"
+    "hammerjs" "^2.0.1"
+    "inherits" "^2.0.1"
+    "min-dash" "^3.5.0"
+    "min-dom" "^3.0.0"
+    "object-refs" "^0.3.0"
+    "path-intersection" "^1.0.2"
+    "tiny-svg" "^2.2.1"
+
+"didi@^4.0.0":
+  "integrity" "sha512-AzMElh8mCHOPWPCWfGjoJRla31fMXUT6+287W5ef3IPmtuBcyG9+MkFS7uPP6v3t2Cl086KwWfRB9mESa0OsHQ=="
+  "resolved" "https://registry.npmjs.org/didi/-/didi-4.0.0.tgz"
+  "version" "4.0.0"
+
+"didi@^5.2.1":
+  "integrity" "sha512-IKNnajUlD4lWMy/Q9Emkk7H1qnzREgY4UyE3IhmOi/9IKua0JYtYldk928bOdt1yNxN8EiOy1sqtSozEYsmjCg=="
+  "resolved" "https://registry.npmjs.org/didi/-/didi-5.2.1.tgz"
+  "version" "5.2.1"
+
 "diffie-hellman@^5.0.0":
   "integrity" "sha1-QOjumPVaIUlgcUaSHGPhrl89KHU="
   "resolved" "https://registry.npm.taobao.org/diffie-hellman/download/diffie-hellman-5.0.3.tgz"
@@ -3552,6 +3692,11 @@
   dependencies:
     "domelementtype" "^2.2.0"
 
+"domify@^1.3.1":
+  "integrity" "sha512-x18nuiDHMCZGXr4KJSRMf/TWYtiaRo6RX8KN9fEbW54mvbQ6pieUuerC2ahBg+kEp1wycFj8MPUI0WkIOw5E9w=="
+  "resolved" "https://registry.npmjs.org/domify/-/domify-1.4.1.tgz"
+  "version" "1.4.1"
+
 "domutils@^1.7.0":
   "integrity" "sha1-Vuo0HoNOBuZ0ivehyyXaZ+qfjCo="
   "resolved" "https://registry.nlark.com/domutils/download/domutils-1.7.0.tgz"
@@ -3628,13 +3773,12 @@
     "jsbn" "~0.1.0"
     "safer-buffer" "^2.1.0"
 
-"echarts@^5.2.2":
-  "integrity" "sha512-yxuBfeIH5c+0FsoRP60w4De6omXhA06c7eUYBsC1ykB6Ys2yK5fSteIYWvkJ4xJVLQgCvAdO8C4mN6MLeJpBaw=="
-  "resolved" "https://registry.npmjs.org/echarts/-/echarts-5.2.2.tgz"
-  "version" "5.2.2"
+"echarts@4.9.0":
+  "integrity" "sha512-+ugizgtJ+KmsJyyDPxaw2Br5FqzuBnyOWwcxPKO6y0gc5caYcfnEUIlNStx02necw8jmKmTafmpHhGo4XDtEIA=="
+  "resolved" "https://registry.npmjs.org/echarts/-/echarts-4.9.0.tgz"
+  "version" "4.9.0"
   dependencies:
-    "tslib" "2.3.0"
-    "zrender" "5.2.1"
+    "zrender" "4.3.2"
 
 "ee-first@1.1.1":
   "integrity" "sha1-WQxhFWsK4vTwJVcyoViyZrxWsh0="
@@ -4566,6 +4710,11 @@
     "duplexer" "^0.1.1"
     "pify" "^4.0.1"
 
+"hammerjs@^2.0.1":
+  "integrity" "sha1-BO93hiz/K7edMPdpIJWTAiK/YPE="
+  "resolved" "https://registry.npmjs.org/hammerjs/-/hammerjs-2.0.8.tgz"
+  "version" "2.0.8"
+
 "handle-thing@^2.0.0":
   "integrity" "sha1-hX95zjWVgMNA1DCBzGSJcNC7I04="
   "resolved" "https://registry.npm.taobao.org/handle-thing/download/handle-thing-2.0.1.tgz"
@@ -4885,6 +5034,11 @@
   "resolved" "https://registry.npm.taobao.org/icss-utils/download/icss-utils-5.1.0.tgz?cache=0&sync_timestamp=1605801619834&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Ficss-utils%2Fdownload%2Ficss-utils-5.1.0.tgz"
   "version" "5.1.0"
 
+"ids@^1.0.0":
+  "integrity" "sha512-Zvtq1xUto4LttpstyOlFum8lKx+i1OmRfg+6A9drFS9iSZsDPMHG4Sof/qwNR4kCU7jBeWFPrY2ocHxiz7cCRw=="
+  "resolved" "https://registry.npmjs.org/ids/-/ids-1.0.0.tgz"
+  "version" "1.0.0"
+
 "ieee754@^1.1.4":
   "integrity" "sha1-jrehCmP/8l0VpXsAFYbRd9Gw01I="
   "resolved" "https://registry.npm.taobao.org/ieee754/download/ieee754-1.2.1.tgz?cache=0&sync_timestamp=1603841204911&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fieee754%2Fdownload%2Fieee754-1.2.1.tgz"
@@ -4953,6 +5107,11 @@
   "resolved" "https://registry.npm.taobao.org/indexes-of/download/indexes-of-1.0.1.tgz"
   "version" "1.0.1"
 
+"indexof@0.0.1":
+  "integrity" "sha1-gtwzbSMrkGIXnQWrMpOmYFn9Q10="
+  "resolved" "https://registry.npmjs.org/indexof/-/indexof-0.0.1.tgz"
+  "version" "0.0.1"
+
 "infer-owner@^1.0.3":
   "integrity" "sha1-xM78qo5RBRwqQLos6KPScpWvlGc="
   "resolved" "https://registry.npm.taobao.org/infer-owner/download/infer-owner-1.0.4.tgz"
@@ -5616,9 +5775,9 @@
     "json5" "^1.0.1"
 
 "loader-utils@^2.0.0":
-  "integrity" "sha512-rP4F0h2RaWSvPEkD7BLDFQnvSf+nK+wr3ESUjNTyAGobqrijmW92zc+SO6d4p4B1wh7+B/Jg1mkQe5NYUEHtHQ=="
-  "resolved" "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.0.tgz"
-  "version" "2.0.0"
+  "integrity" "sha512-TM57VeHptv569d/GKh6TAYdzKblwDNiumOdkFnejjD0XwTH87K90w3O7AiJRqdQoXygvi1VQTJTLGhJl7WqA7A=="
+  "resolved" "https://registry.npmjs.org/loader-utils/-/loader-utils-2.0.2.tgz"
+  "version" "2.0.2"
   dependencies:
     "big.js" "^5.2.2"
     "emojis-list" "^3.0.0"
@@ -5774,6 +5933,11 @@
   "resolved" "https://registry.npmjs.org/marked/-/marked-2.1.3.tgz"
   "version" "2.1.3"
 
+"matches-selector@^1.2.0":
+  "integrity" "sha512-c4vLwYWyl+Ji+U43eU/G5FwxWd4ZH0ePUsFs5y0uwD9HUEFBXUQ1zUUan+78IpRD+y4pUfG0nAzNM292K7ItvA=="
+  "resolved" "https://registry.npmjs.org/matches-selector/-/matches-selector-1.2.0.tgz"
+  "version" "1.2.0"
+
 "md5.js@^1.3.4":
   "integrity" "sha1-tdB7jjIW4+J81yjXL3DR5qNCAF8="
   "resolved" "https://registry.npm.taobao.org/md5.js/download/md5.js-1.3.5.tgz"
@@ -5918,6 +6082,21 @@
   "resolved" "https://registry.nlark.com/mimic-fn/download/mimic-fn-2.1.0.tgz"
   "version" "2.1.0"
 
+"min-dash@^3.0.0", "min-dash@^3.1.0", "min-dash@^3.5.0", "min-dash@^3.5.2":
+  "integrity" "sha512-a0TLbmL6p4RlNGblZcLd2yjPORp+bCYRlNGvwK5OMwWaMROWh1DlRgN9W8jJm2x9gVuscvD38BEosV7cnikKnw=="
+  "resolved" "https://registry.npmjs.org/min-dash/-/min-dash-3.8.0.tgz"
+  "version" "3.8.0"
+
+"min-dom@^3.0.0", "min-dom@^3.1.0", "min-dom@^3.1.1", "min-dom@^3.1.3":
+  "integrity" "sha512-Lbi1NZjLV9Hg6/bEe2Lfk2Fzsv1MwheR61whqTLP+FxLndYo9TxpksEgM5Kr1khjfCtFTMr0waeEfwIpStkRdw=="
+  "resolved" "https://registry.npmjs.org/min-dom/-/min-dom-3.1.3.tgz"
+  "version" "3.1.3"
+  dependencies:
+    "component-event" "^0.1.4"
+    "domify" "^1.3.1"
+    "indexof" "0.0.1"
+    "matches-selector" "^1.2.0"
+
 "mini-css-extract-plugin@^0.9.0":
   "integrity" "sha1-R/LPB6oWWrNXM7H8l9TEbAVkM54="
   "resolved" "https://registry.nlark.com/mini-css-extract-plugin/download/mini-css-extract-plugin-0.9.0.tgz?cache=0&sync_timestamp=1628094167664&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fmini-css-extract-plugin%2Fdownload%2Fmini-css-extract-plugin-0.9.0.tgz"
@@ -5973,6 +6152,11 @@
     "stream-each" "^1.1.0"
     "through2" "^2.0.0"
 
+"mitt@^1.1.3":
+  "integrity" "sha512-r6lj77KlwqLhIUku9UWYes7KJtsczvolZkzp8hbaDPPaE24OmWl5s539Mytlj22siEQKosZ26qCBgda2PKwoJw=="
+  "resolved" "https://registry.npmjs.org/mitt/-/mitt-1.2.0.tgz"
+  "version" "1.2.0"
+
 "mitt@^3.0.0":
   "integrity" "sha512-7dX2/10ITVyqh4aOSVI9gdape+t9l2/8QxHrFmUXu4EEUpdlxl6RudZUPZoc+zuY2hk1j7XxVroIVIan/pD/SQ=="
   "resolved" "https://registry.npmjs.org/mitt/-/mitt-3.0.0.tgz"
@@ -5993,6 +6177,43 @@
   dependencies:
     "minimist" "^1.2.5"
 
+"moddle-xml@^7.5.0":
+  "integrity" "sha512-wPm3TD9910Iblp4lg1okHDRilY9gTvNBdo7ZHBmBzH4OioF5R2hvG3SMyn7cAUjOUg0kYUfChHgcUEO+qUc77Q=="
+  "resolved" "https://registry.npmjs.org/moddle-xml/-/moddle-xml-7.5.0.tgz"
+  "version" "7.5.0"
+  dependencies:
+    "min-dash" "^3.0.0"
+    "moddle" "^4.1.0"
+    "saxen" "^8.1.0"
+
+"moddle-xml@^8.0.8":
+  "integrity" "sha512-JzW8wUCH7Qze7eh0T8A1exi7QJg6hRgq+uw8goHNP5Q7pWTGrLj83S+NgA/94M2I0JmqnK9hw3sCbyiKVOjc4Q=="
+  "resolved" "https://registry.npmjs.org/moddle-xml/-/moddle-xml-8.0.8.tgz"
+  "version" "8.0.8"
+  dependencies:
+    "min-dash" "^3.0.0"
+    "moddle" "^5.0.1"
+    "saxen" "^8.1.2"
+
+"moddle@^4.1.0":
+  "integrity" "sha512-asBaDLTTNpv4oC8iFdwonfMf/noPVvaBDXoSL7AsXZUDqwokgy8Lsf5eXwdnjXiDqm0olYi/S3Do544uVJSQDg=="
+  "resolved" "https://registry.npmjs.org/moddle/-/moddle-4.1.0.tgz"
+  "version" "4.1.0"
+  dependencies:
+    "min-dash" "^3.0.0"
+
+"moddle@^5.0.1":
+  "integrity" "sha512-nBEyKt7sDw6MlM6e85lTCEXButw+p7hubEoRo/JyX+dBzDcGjDoktPuby9QE+ylW1ABZqNvRy8pK0h+23tIW2g=="
+  "resolved" "https://registry.npmjs.org/moddle/-/moddle-5.0.2.tgz"
+  "version" "5.0.2"
+  dependencies:
+    "min-dash" "^3.0.0"
+
+"mousetrap@^1.6.5":
+  "integrity" "sha512-QNo4kEepaIBwiT8CDhP98umTetp+JNfQYBWvC1pc6/OAibuXtRcxZ58Qz8skvEHYvURne/7R8T5VoOI7rDsEUA=="
+  "resolved" "https://registry.npmjs.org/mousetrap/-/mousetrap-1.6.5.tgz"
+  "version" "1.6.5"
+
 "move-concurrently@^1.0.1":
   "integrity" "sha1-viwAX9oy4LKa8fBdfEszIUxwH5I="
   "resolved" "https://registry.npm.taobao.org/move-concurrently/download/move-concurrently-1.0.1.tgz"
@@ -6271,6 +6492,11 @@
   "resolved" "https://registry.npm.taobao.org/object-keys/download/object-keys-1.1.1.tgz"
   "version" "1.1.1"
 
+"object-refs@^0.3.0":
+  "integrity" "sha512-eP0ywuoWOaDoiake/6kTJlPJhs+k0qNm4nYRzXLNHj6vh+5M3i9R1epJTdxIPGlhWc4fNRQ7a6XJNCX+/L4FOQ=="
+  "resolved" "https://registry.npmjs.org/object-refs/-/object-refs-0.3.0.tgz"
+  "version" "0.3.0"
+
 "object-visit@^1.0.0":
   "integrity" "sha1-95xEk68MU3e1n+OdOV5BBC3QRbs="
   "resolved" "https://registry.npm.taobao.org/object-visit/download/object-visit-1.0.1.tgz"
@@ -6575,6 +6801,16 @@
   "resolved" "https://registry.nlark.com/path-exists/download/path-exists-4.0.0.tgz?cache=0&sync_timestamp=1628765027018&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fpath-exists%2Fdownload%2Fpath-exists-4.0.0.tgz"
   "version" "4.0.0"
 
+"path-intersection@^1.0.2":
+  "integrity" "sha512-EdeUuXCm0+tb/2gv8PmRhd9fYYOtbDeTYkwCnzkBuAEjevEZi2mWUi1DVFF5nqSObYsxKcchvKUhnRULWOFreQ=="
+  "resolved" "https://registry.npmjs.org/path-intersection/-/path-intersection-1.1.1.tgz"
+  "version" "1.1.1"
+
+"path-intersection@^2.2.1":
+  "integrity" "sha512-9u8xvMcSfuOiStv9bPdnRJQhGQXLKurew94n4GPQCdH1nj9QKC9ObbNoIpiRq8skiOBxKkt277PgOoFgAt3/rA=="
+  "resolved" "https://registry.npmjs.org/path-intersection/-/path-intersection-2.2.1.tgz"
+  "version" "2.2.1"
+
 "path-is-absolute@^1.0.0":
   "integrity" "sha1-F0uSaHNVNP+8es5r9TpanhtcX18="
   "resolved" "https://registry.npm.taobao.org/path-is-absolute/download/path-is-absolute-1.0.1.tgz"
@@ -7103,6 +7339,11 @@
     "nanoid" "^3.1.23"
     "source-map-js" "^0.6.2"
 
+"preact@^10.4.8":
+  "integrity" "sha512-WyosM7pxGcndU8hY0OQlLd54tOU+qmG45QXj2dAYrL11HoyU/EzOSTlpJsirbBr1QW7lICxSsVJJmcmUglovHQ=="
+  "resolved" "https://registry.npmjs.org/preact/-/preact-10.6.4.tgz"
+  "version" "10.6.4"
+
 "prelude-ls@~1.1.2":
   "integrity" "sha1-IZMqVJ9eUv/ZqCf1cOBL5iqX2lQ="
   "resolved" "https://registry.npm.taobao.org/prelude-ls/download/prelude-ls-1.1.2.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fprelude-ls%2Fdownload%2Fprelude-ls-1.1.2.tgz"
@@ -7317,6 +7558,14 @@
     "iconv-lite" "0.4.24"
     "unpipe" "1.0.0"
 
+"raw-loader@^4.0.2":
+  "integrity" "sha512-ZnScIV3ag9A4wPX/ZayxL/jZH+euYb6FcUinPcgiQW0+UBtEv0O6Q3lGd3cqJ+GHH+rksEv3Pj99oxJ3u3VIKA=="
+  "resolved" "https://registry.npmjs.org/raw-loader/-/raw-loader-4.0.2.tgz"
+  "version" "4.0.2"
+  dependencies:
+    "loader-utils" "^2.0.0"
+    "schema-utils" "^3.0.0"
+
 "read-pkg@^5.1.1":
   "integrity" "sha1-e/KVQ4yloz5WzTDgU7NO5yUMk8w="
   "resolved" "https://registry.nlark.com/read-pkg/download/read-pkg-5.2.0.tgz?cache=0&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fread-pkg%2Fdownload%2Fread-pkg-5.2.0.tgz"
@@ -7689,6 +7938,11 @@
   "resolved" "https://registry.npm.taobao.org/sax/download/sax-1.2.4.tgz"
   "version" "1.2.4"
 
+"saxen@^8.1.0", "saxen@^8.1.2":
+  "integrity" "sha512-xUOiiFbc3Ow7p8KMxwsGICPx46ZQvy3+qfNVhrkwfz3Vvq45eGt98Ft5IQaA1R/7Tb5B5MKh9fUR9x3c3nDTxw=="
+  "resolved" "https://registry.npmjs.org/saxen/-/saxen-8.1.2.tgz"
+  "version" "8.1.2"
+
 "schema-utils@^1.0.0":
   "integrity" "sha1-C3mpMgTXtgDUsoUNH2bCo0lRx3A="
   "resolved" "https://registry.nlark.com/schema-utils/download/schema-utils-1.0.0.tgz?cache=0&sync_timestamp=1626694740261&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fschema-utils%2Fdownload%2Fschema-utils-1.0.0.tgz"
@@ -7707,6 +7961,15 @@
     "ajv" "^6.12.4"
     "ajv-keywords" "^3.5.2"
 
+"schema-utils@^3.0.0":
+  "integrity" "sha512-Y5PQxS4ITlC+EahLuXaY86TXfR7Dc5lw294alXOq86JAHCihAIZfqv8nNCWvaEJvaC51uN9hbLGeV0cFBdH+Fw=="
+  "resolved" "https://registry.npmjs.org/schema-utils/-/schema-utils-3.1.1.tgz"
+  "version" "3.1.1"
+  dependencies:
+    "@types/json-schema" "^7.0.8"
+    "ajv" "^6.12.5"
+    "ajv-keywords" "^3.5.2"
+
 "screenfull@^5.0.2":
   "integrity" "sha512-dYaNuOdzr+kc6J6CFcBrzkLCfyGcMg+gWkJ8us93IQ7y1cevhQAugFsaCdMHb6lw8KV3xPzSxzH7zM1dQap9mA=="
   "resolved" "https://registry.npmjs.org/screenfull/-/screenfull-5.1.0.tgz"
@@ -7719,11 +7982,25 @@
   dependencies:
     "debug" "^4.2.0"
 
+"scroll-tabs@^1.0.1":
+  "integrity" "sha512-W4xjEwNS4QAyQnaJ450vQTcKpbnalBAfsTDV926WrxEMOqjyj2To8uv2d0Cp0oxMdk5TkygtzXmctPNc2zgBcg=="
+  "resolved" "https://registry.npmjs.org/scroll-tabs/-/scroll-tabs-1.0.1.tgz"
+  "version" "1.0.1"
+  dependencies:
+    "min-dash" "^3.1.0"
+    "min-dom" "^3.1.0"
+    "mitt" "^1.1.3"
+
 "select-hose@^2.0.0":
   "integrity" "sha1-Yl2GWPhlr0Psliv8N2o3NZpJlMo="
   "resolved" "https://registry.npm.taobao.org/select-hose/download/select-hose-2.0.0.tgz"
   "version" "2.0.0"
 
+"selection-update@^0.1.2":
+  "integrity" "sha1-gDoETcxu2rWjrmSPXwNX6JrWa5Y="
+  "resolved" "https://registry.npmjs.org/selection-update/-/selection-update-0.1.2.tgz"
+  "version" "0.1.2"
+
 "selfsigned@^1.10.8":
   "integrity" "sha1-JJKc2Qb+D0S20B+yOZmnOVN6y+k="
   "resolved" "https://registry.nlark.com/selfsigned/download/selfsigned-1.10.11.tgz"
@@ -8480,6 +8757,11 @@
   "resolved" "https://registry.npm.taobao.org/timsort/download/timsort-0.3.0.tgz"
   "version" "0.3.0"
 
+"tiny-svg@^2.2.1", "tiny-svg@^2.2.2":
+  "integrity" "sha512-u6zCuMkDR/3VAh83X7hDRn/pi0XhwG2ycuNS0cTFtQjGdOG2tSvEb8ds65VeGWc3H6PUjJKeunueXqgkZqtMsg=="
+  "resolved" "https://registry.npmjs.org/tiny-svg/-/tiny-svg-2.2.2.tgz"
+  "version" "2.2.2"
+
 "tinymce@^5.10.2", "tinymce@^5.5.0":
   "integrity" "sha512-5QhnZ6c8F28fYucLLc00MM37fZoAZ4g7QCYzwIl38i5TwJR5xGqzOv6YMideyLM4tytCzLCRwJoQen2LI66p5A=="
   "resolved" "https://registry.npmjs.org/tinymce/-/tinymce-5.10.2.tgz"
@@ -8572,11 +8854,6 @@
   "resolved" "https://registry.npmjs.org/tslib/-/tslib-2.3.1.tgz"
   "version" "2.3.1"
 
-"tslib@2.3.0":
-  "integrity" "sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg=="
-  "resolved" "https://registry.npmjs.org/tslib/-/tslib-2.3.0.tgz"
-  "version" "2.3.0"
-
 "tty-browserify@0.0.0":
   "integrity" "sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY="
   "resolved" "https://registry.npm.taobao.org/tty-browserify/download/tty-browserify-0.0.0.tgz"
@@ -8912,6 +9189,11 @@
     "bmaplib.markerclusterer" "^1.0.13"
     "markdown-it" "^8.4.0"
 
+"vue-bpmn@^0.3.0":
+  "integrity" "sha512-gp43Qx34HzOIbhzxFL3gXmkc28NDQE79boPcqMHbQ6y351Jys7tPk+mdsKATIN5IAM2UfraIQxhylvb4/vubgA=="
+  "resolved" "https://registry.npmjs.org/vue-bpmn/-/vue-bpmn-0.3.0.tgz"
+  "version" "0.3.0"
+
 "vue-demi@*":
   "integrity" "sha512-/3xFwzSykLW2HiiLie43a+FFgNOcokbBJ+fzvFXd0r2T8MYohqvphUyDQ8lbAwzQ3Dlcrb1c9ykifGkhSIAk6A=="
   "resolved" "https://registry.npmjs.org/vue-demi/-/vue-demi-0.11.4.tgz"
@@ -8935,6 +9217,11 @@
   "resolved" "https://registry.npm.taobao.org/vue-hot-reload-api/download/vue-hot-reload-api-2.3.4.tgz"
   "version" "2.3.4"
 
+"vue-json-pretty@^1.8.2":
+  "integrity" "sha512-8DbgvyXpBrhDdBzz8RTe+POZ+HI6nSa33DqsPMWhMkv0u0ATklgxErUM3XRRvTzOQ/02Sh1LNWJ/rkqTow2rbA=="
+  "resolved" "https://registry.npmjs.org/vue-json-pretty/-/vue-json-pretty-1.8.2.tgz"
+  "version" "1.8.2"
+
 "vue-loader-v16@npm:vue-loader@^16.1.0":
   "integrity" "sha512-V53TJbHmzjBhCG5OYI2JWy/aYDspz4oVHKxS43Iy212GjGIG1T3EsB3+GWXFm/1z5VwjdjLmdZUFYM70y77vtQ=="
   "resolved" "https://registry.npmjs.org/vue-loader/-/vue-loader-16.8.1.tgz"
@@ -8990,7 +9277,7 @@
   "resolved" "https://registry.npm.taobao.org/vue-template-es2015-compiler/download/vue-template-es2015-compiler-1.9.1.tgz"
   "version" "1.9.1"
 
-"vue@^2 || ^3.0.0-0", "vue@^2.1.8", "vue@^2.6.0 || ^3.2.0", "vue@^3.0.0", "vue@^3.0.0-0 || ^2.6.0", "vue@^3.0.2", "vue@^3.2.0":
+"vue@^2 || ^3.0.0-0", "vue@^2.1.8", "vue@^2.6.0 || ^3.2.0", "vue@^3.0.0", "vue@^3.0.0-0 || ^2.6.0", "vue@^3.0.2", "vue@^3.2.0", "vue@^3.2.4":
   "integrity" "sha1-xxRFB4dR9Fhkj9j7Oi2pdVB9A9I="
   "resolved" "https://registry.nlark.com/vue/download/vue-3.2.6.tgz?cache=0&sync_timestamp=1629824252933&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fvue%2Fdownload%2Fvue-3.2.6.tgz"
   "version" "3.2.6"
@@ -9373,9 +9660,7 @@
     "normalize-path" "^1.0.0"
     "strip-indent" "^2.0.0"
 
-"zrender@5.2.1":
-  "integrity" "sha512-M3bPGZuyLTNBC6LiNKXJwSCtglMp8XUEqEBG+2MdICDI3d1s500Y4P0CzldQGsqpRVB7fkvf3BKQQRxsEaTlsw=="
-  "resolved" "https://registry.npmjs.org/zrender/-/zrender-5.2.1.tgz"
-  "version" "5.2.1"
-  dependencies:
-    "tslib" "2.3.0"
+"zrender@4.3.2":
+  "integrity" "sha512-bIusJLS8c4DkIcdiK+s13HiQ/zjQQVgpNohtd8d94Y2DnJqgM1yjh/jpDb8DoL6hd7r8Awagw8e3qK/oLaWr3g=="
+  "resolved" "https://registry.npmjs.org/zrender/-/zrender-4.3.2.tgz"
+  "version" "4.3.2"