本文的目的是：将整合到系统中的activiti流程编辑器中任务节点的候选人和候选组输入框修改为弹出选择框，因为系统中有用户管理模块，所有的用户都要调用用户管理模块的接口，不能使用手动输入的方式。
备注：本文中所涉及的所有文件均可在文末的云盘中找到，包括修改的文件和添加的文件。
1、找到html文件：process-editor\editor-app\configuration\properties\assignment-popup.html
添加文件中红框部分的代码：
注：ng-click是此节点的点击事件，ng-value是此节点显示的值。
2、在文件夹process-editor\editor-app\configuration\properties\中添加文件：
assignment-candidateGroup.html
assignment-popup-popup.html
这两个文件一个是选择用户的模态框，一个是选择组的模态框。文件在文末的云盘中，这是我写的两个比较简单的界面，大家可根据需要自行修改或重新编写。
3、找到js文件：process-editor\editor-app\configuration\properties-assignment-controller.js
添加代码：
①在此处添加红色代码
②在上图所示ctrl中添加代码块：
//Open the dialog to select users$scope.choseAssignment = function(flag) {var opts = {template: 'editor-app/configuration/properties/assignment-popup-popup.html?version=' + Date.now(),scope: $scope};$scope.choseAssignmentFlag = flag;// Open the dialog$modal(opts);}//Open the dialog to select candidateGroups$scope.choseCandidateGroups = function(){var opts = {template: 'editor-app/configuration/properties/assignment-candidateGroup.html?version=' + Date.now(),scope: $scope};// Open the dialog$modal(opts);}//因新打开的界面上选定的数据要传输到当前modal中，所以使用此方式，这是angular.js中子窗口向父窗口传输数据的方式$scope.$on('choseAssigneesStr', function(event,data){$scope.assignment.candidateUsers[0].value = data;});$scope.$on('choseAssigneeStr', function(event,data){$scope.assignment.assignee = data;});$scope.$on('choseCandidateGroupsStr', function(event,data){$scope.assignment.candidateGroups[0].value = data;});
③在①的ctrl之外添加代码块：
//用户选择模态框的控制器var KisBpmChoseAssignmentCtrl = ['$scope', '$http', function($scope, $http) {//初始化左边菜单栏数据，并触发第一个菜单的点击事件var roles = [];var initId;$scope.getAllRoles = function (successCallback) {$http({ method: 'get',headers: {'Accept': 'application/json','Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'},url: '[URL]'}) //此处是获取所需角色的URL.success(function (data, status, headers, config) {//根据需要处理数据，将其封装成List<json>格式的数据，json中包含id和name（注：json中的数据可根据需要自行增删）var obj = data.obj.object;for (var i=0; i<obj.length; i++) {if (i==0) {initId = obj[i].id + "";$scope.getAllAccountByRole(initId);}roles.push({id:obj[i].id,name:obj[i].name});}//将封装好的roles数据赋值给全局变量roles$scope.roles = roles;}).error(function (data, status, headers, config) {});};$scope.getAllRoles(function(){});$scope.getAllAccountByRole = function(value) {$http({ method: 'get',headers: {'Accept': 'application/json','Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'},url: '[URL]'+value}) //根据roleId获取当前组的用户数据的URL,value为roleId.success(function (data, status, headers, config) {//封装数据var obj = data.obj;if (data != null) {var accounts = [];for (var i=0; i<obj.length; i++) {accounts.push({id:obj[i].id, code : obj[i].employeeCode, name : obj[i].userName, index:i});}$scope.accounts=accounts;}}).error(function (data, status, headers, config) {});};// Close button handler$scope.close = function() {$scope.$hide();};$scope.formData = {};$scope.candidateUser={};//Save Data$scope.save = function() {if ($scope.choseAssignmentFlag == "assignee") {var choseAssignee = $scope.formData.assignee;//子窗口向父窗口传输数据$scope.$emit('choseAssigneeStr', choseAssignee);} else if ($scope.choseAssignmentFlag == "assignees") {var choseAssignees = $scope.accounts;var choseAssigneesStr = "";for (var i=0;i<choseAssignees.length; i++) {if (choseAssignees[i].selected) {choseAssigneesStr += choseAssignees[i].id + ",";}}choseAssigneesStr = choseAssigneesStr.substring(0,choseAssigneesStr.length-1);//子窗口向父窗口传输数据$scope.$emit('choseAssigneesStr', choseAssigneesStr);}$scope.close();};$scope.selectAll = function($event) {var checkbox = $event.target;var choseAssignees = $scope.accounts;for (var i=0;i<choseAssignees.length; i++) {if (checkbox.checked) {choseAssignees[i].selected = true;} else {choseAssignees[i].selected = false;}}$scope.accounts = choseAssignees;}}];//组选择模态框的控制器var KisBpmChoseCandidateGroupsCtrl = ['$scope', '$http', function($scope, $http) {var candidateGroups = [];$scope.getAllRoles = function (successCallback) {$http({ method: 'get',headers: {'Accept': 'application/json','Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'},url: '/role/list'}).success(function (data, status, headers, config) {var obj = data.obj.object;for (var i=0; i<obj.length; i++) {candidateGroups.push({id:obj[i].id,name:obj[i].name,description:obj[i].description});}$scope.candidateGroups = candidateGroups;}).error(function (data, status, headers, config) {});};$scope.getAllRoles(function() {});//关闭按钮的点击事件// Close button handler$scope.close = function() {$scope.$hide();};//保存按钮的点击事件$scope.save = function() {var choseCandidateGroups = $scope.candidateGroups;var choseCandidateGroupsStr = "";for (var i=0;i<choseCandidateGroups.length; i++) {if (choseCandidateGroups[i].selected) {choseCandidateGroupsStr += choseCandidateGroups[i].id + ",";}}choseCandidateGroupsStr = choseCandidateGroupsStr.substring(0,choseCandidateGroupsStr.length-1);//子窗口向父窗口传输数据$scope.$emit('choseCandidateGroupsStr', choseCandidateGroupsStr);$scope.close();}//全选框的点击事件$scope.selectAll = function($event) {var checkbox = $event.target;var candidateGroups = $scope.candidateGroups;for (var i=0;i<candidateGroups.length; i++) {if (checkbox.checked) {candidateGroups[i].selected = true;} else {candidateGroups[i].selected = false;}}$scope.candidateGroups = candidateGroups;}}];
4、修改后点击任务派遣效果如图：
点击任务执行人或候选人的输入框效果如图：
点击候选组的输入框的效果如图：
备注：百度云盘：/s/1kUPPqsB
