工作流项目 - 流程图绘图插件：jc-bpmn-js-properties-panel-activiti.js
========================
# v 1.0.6
1. 版本说明
- 连接器添加connectorName属性
# v 1.0.5
1. 版本说明
- 开始节点添加设置抄送人配置项
# v 1.0.4
## Release Notes
1. 版本说明
- 表单多选修改显示tag代码；表单key添加documentation元素；资源配置fields修改返参；
- 设置经办者时，选择关系数据不单独设置属性，放在userinfo里面，判断是否只设置了部门没有设置角色（岗位），改变节点属性；
- 修改办理人配置为资源配置；隐藏是否自动选人配置；
- 修改连接器相关；
- 修改serviceTask节点，实现方式activiti-implementation-select属性，只保留连接器，其余方式删除；
- 办理类型选择非并行多实例时隐藏完成条件配置；修改完成条件为下拉选择框；
- 当勾选了服务组件时，把办理设置、是否自动选人、办理类型设置隐藏，如果没勾选服务组件，把这三个显示；
- 调整办理类型设置的顺序，放在是否自动选人下面，把服务组件放在办理设置上面；把办理类型f放在userGroup里面；
- 修改排序组代码；添加是否自动选人组；
- 将人员组放在基本信息中，修改排序、权限按钮、微流程标题样式；
- factory下js文件的button元素删除data-disable=isDisabled属性【解决火狐浏览器无法点击按钮问题】；
- 已发布的流程设计，多实例的完成条件可以修改；多实例类型添加bpmn:SubProcess子流程节点可以设置；
- 多实例类型添加“多人并行异步“；
- 用户节点添加超期设置；
2. 示例图
# v 0.0.2
## Release Notes
1. 版本说明
- 连接线 右侧属性面板隐藏 监听、扩展 面板
# v 0.0.1
## Release Notes
1. 版本说明
- 用户任务 右侧属性面板添加 人员 面板
点击 设置 按钮根据弹框内所选人员信息反显
- 服务任务 右侧属性面板实现方式添加 消息通知 选项
- 服务任务 右侧属性面板 连接器 面板
点击 设置 按钮根据弹框内所选服务反显连接器信息及对应输入/输出参数
## 代码示例
``` javascript
以修改用户任务右侧面板为例：
/*
* ./lib/factory/UserTextInputEntryFactory.js
*/
...
// 点击设置按钮，暴露 userTaskSelectCallBack 函数，输出 1.右侧属性面板input框id；2.右侧属性面板input框dom元素上的属性；3.xml源文件中对应的dom节点id；
var defaultButtonAction = function(element, inputNode) {
var input = domQuery('textarea[name="' + options.modelProperty + '"]', inputNode);
outputs.userTaskSelectCallBack(options.element.id, 'activiti-' + resource.id, input.getAttribute('data-user-value'))
return true;
};
...
// 通过index.js文件触发 get方法，获取到人员选择弹框返回的数据
resource.get = function(element, node) {
var bo = getBusinessObject(element);
var usertask = (getElements(bo, 'activiti:Userproperties') || [])[0];
var value = usertask && usertask.get('alias');
return { alias: value};
}
// 通过触发 set方法，给xml源文件设置dom节点
resource.set = function(element, values, node) {
businessObject = businessObject || getBusinessObject(element);
var userinfos = node.querySelector('#activiti-' + resource.id).getAttribute('data-user-value')
values.userinfos = userinfos
...
var field = elementHelper.createElement('activiti:Userproperties', values, extensionElements, options.bpmnFactory);
var usertaskElements = getElements(bo, 'activiti:Userproperties') || [];
if (usertaskElements.length == 0) {
commands.push(cmdHelper.addElementsTolist(element, extensionElements, 'values', [ field ]));
} else {
commands.push(cmdHelper.updateBusinessObject(element, extensionElements, {
values: [ field ]
}));
}
...
}
/*
* ./lib/provider/activiti/parts/UserProps.js
*/
...
module.exports = function(group, element, bpmnFactory, translate) {
if (is(element, 'bpmn:UserTask')) { // 可以在这里做类型判断
group.entries.push(entryFactory.userTextField({
id : 'userproperties',
description : '', // 面板描述
label : '节点维护信息', // 面板名称
modelProperty : 'alias', // xml源文件dom节点的value属性名称
prefix: 'userproperties',
element,
bpmnFactory,
disabled: function(){ // 是否禁用
return true
},
}));
}
}
...
/*
* ./lib/index.js
*/
module.exports = {
...
// 用户选择
userTaskSelectCallBack: () => {},
setUserTask: (id, value, str) => {
document.getElementById(id).value = str // 给右侧属性面板的input赋值
document.getElementById(id).setAttribute('data-user-value',value) // 给右侧属性面板的dom元素input设置属性value
var changeEvent = document.createEvent ("HTMLEvents");
changeEvent.initEvent ("change", true, true);
document.getElementById(id).dispatchEvent (changeEvent); // 刷新页面dom渲染数据
},
...
}
```
## 其他说明
[任务说明](http://jira.jcinfo.com:8080/projects/CPXGZLYY/issues/CPXGZLYY-1)