html5工作流控件,activiti web designer 工作流设计器自定义输入显示控件

activiti web designer 工作流设计器自定义输入显示控件

editor-app/configuration/properties.js

增加：

1

2

3

4

"pandy-form-select":{

"readModeTemplateUrl":"editor-app/configuration/properties/custom/form-select-display-template.html",

"writeModeTemplateUrl":"editor-app/configuration/properties/custom/form-select-write-mode-template.html"

}

resources/stencilset.json.en

找到要修改的控件，比如Form Key要变成可以选择的下拉框，那么找到

1

2

3

4

5

6

7

8

9

10

11

{

"name":"formkeydefinitionpackage",

"properties":[{

"id":"formkeydefinition",

"type":"String",//要该成这里成==>pandy-form-select

"title":"Form key",

"value":"",

"description":"Form key that provides a reference to a form.",

"popular":true

}]

}

1

2

3

4

5

6

7

8

9

10

11

{

"name":"formkeydefinitionpackage",

"properties":[{

"id":"formkeydefinition",

"type":"pandy-form-select",

"title":"Form key",

"value":"",

"description":"Form key that provides a reference to a form.",

"popular":true

}]

}

复制字符串的末扮文件，得到新模板：

default-value-display-template.html ==> editor-app/configuration/properties/custom/form-select-display-template.html

string-property-write-mode-template.html ==> editor-app/configuration/properties/custom/form-select-write-mode-template.html

最后进行修改成自己想要的控件

form-select-display-template.html

1

2

3

{{property.value|limitTo:20}}

20">...

PROPERTY.EMPTY

方式１：这种方式很无奈，是因为自己还没学angularjs，所以不得不这么做．

form-select-write-mode-template.html

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

{{property.value}}

varselectEle=jQuery("select[_id=custom_form]");

selectEle.empty();

jQuery.ajax({

type:"post",

contentType:"application/json; charset=utf-8",

datatype:"json",

url:ACTIVITI.CONFIG.activitiContextRoot+"/getAllCustomForms.do",

data:"{}",

success:function(context){

selectEle.append('不选择');

jQuery.each(context.data.formList,function(i){

selectEle.append(''+this.name+'');

});

varcustom_form_val=jQuery("label[_id=custom_form_val]").text();

selectEle.val(custom_form_val);

}

});