JOffice中的自定義發文流程與運行模板設計

開發與設計公文流程在全部的政府oa項目上都少不了此需求，而能靈活定義一個在線的公文發文與收文流程尤爲重要，J.Office經過過Velocity模板技術進行表單定義，同時結合WebOffice能很是容易實如今線公文的擬稿、保留修改痕跡、而且進行套紅、套打功能。

 

在介紹本文以前，咱們先看一下其中一個發文流程：

 

 

這是一個稍爲複雜的發文流程，用jbpm工具發這個流程並不成問題，問題是這個流程設計好，其裏面的每一個任務如何跟公文系統的數據進行對應起來。

 

J.Office提供了流程的表單技術，經過Velocity，能夠把表單裏面對應的任務直接保存至公文系統，而且同時讓流程跳轉至下一步。

 

如其中一個任務表單的設計：

Java代碼

1. FlowPanel=Ext.extend(Ext.form.FormPanel,{   
2.     constructor:function(cfg){   
3.         this.officePanel=new OfficePanel({   
4.             height:490,   
5.             filePath:'${doc_path}',   
6.             showToolbar:true  
7.         });   
8.         FlowPanel.superclass.constructor.call(this,{   
9.             bodyStyle:'padding:5px',   
10.             title:'辦公室主任審覈',   
11.             height:600,   
12.             width:800,   
13.             layout:'form',   
14.             items:[   
15.                 {   
16.                     fieldLabel:'審覈意見',   
17.                     name:'zr_option',   
18.                     xtype:'textarea',   
19.                     width:400,   
20.                     allowBlank:false,   
21.                     anchor:'98%,98%'  
22.                 },this.officePanel.panel   
23.             ]   
24.         });   
25.     },   
26.     save:function(){   
27.             if(!this.getForm().isValid()) return;   
28.             //TODO 保存個人流程表單至個人自定義表   
29.             this.officePanel.saveDoc({   
30.                 fileCat : 'archIssue',   
31.                 docPath:this.officePanel.filePath   
32.             });   
33.             return true;   
34.     }   
35. })  

FlowPanel=Ext.extend(Ext.form.FormPanel,{
	constructor:function(cfg){
	    this.officePanel=new OfficePanel({
	    	height:490,
	    	filePath:'${doc_path}',
	    	showToolbar:true
	    });
		FlowPanel.superclass.constructor.call(this,{
			bodyStyle:'padding:5px',
			title:'辦公室主任審覈',
			height:600,
			width:800,
			layout:'form',
			items:[
				{
					fieldLabel:'審覈意見',
					name:'zr_option',
					xtype:'textarea',
					width:400,
					allowBlank:false,
					anchor:'98%,98%'
				},this.officePanel.panel
			]
		});
	},
	save:function(){
			if(!this.getForm().isValid()) return;
			//TODO 保存個人流程表單至個人自定義表
			this.officePanel.saveDoc({
				fileCat : 'archIssue',
				docPath:this.officePanel.filePath
			});
			return true;
	}
})

  

對應的界面以下所示：

 

 

在以上能夠比較容易在進行流程的跳轉前，咱們能夠在這裏處理咱們的公文，如保存，套紅，修改等操做，完成後再進行下一步的跳轉處理。

 

注意，在VM模板中，咱們也使用了${doc_path}這些變量，其值來自流程表單的提交，而且會在流程跳轉過程當中一直存在，以方便流程讀取這些變量。

 

其餘表單的設計也相似。

 

 

鑑於之前使用的WebOffice控件封裝得不太好，如今附上一個封裝較好的使用代碼示例：

Java代碼

1. OfficePanel=function(conf){   
2.        
3.     var officeObj = document.createElement('object');   
4.     officeObj.width = "100%";   
5.     officeObj.height = "100%";   
6.     officeObj.classid= "clsid:E77E049B-23FC-4DB8-B756-60529A35FAD5";    
7.     officeObj.codebase = __ctxPath+'/js/core/weboffice/weboffice_V6.0.4.6.cab#V6,0,4,6';   
8.        
9.     var panelConf={border:false,layout:'fit'};   
10.        
11.     if(conf.showToolbar){   
12.         panelConf.tbar=new Ext.Toolbar({   
13.             items:[   
14.                 {   
15.                     text : '保留修改痕跡',   
16.                     iconCls : 'btn-archive-save-trace',   
17.                     handler : function() {   
18.                         officeObj.SetTrackRevisions(1);   
19.                         officeObj.SetCurrUserName(curUserInfo.fullname);   
20.                     }   
21.                 }, '-', {   
22.                     text : '取消保留痕跡',   
23.                     iconCls : 'btn-archive-cancel-trace',   
24.                     handler : function() {   
25.                         officeObj.SetTrackRevisions(0);   
26.                     }   
27.                 }, '-',{   
28.                     text : '清除痕跡',   
29.                     iconCls : 'btn-archive-eraser',   
30.                     handler : function() {   
31.                         officeObj.SetTrackRevisions(4);   
32.                     }   
33.                 }, '-',{   
34.                     text:'加入套紅模板',   
35.                     iconCls:'',   
36.                     handler:function(){   
37.                         new ArchTemplateSelector({   
38.                                 callback : function(tempPath) {   
39.                                     var filePath=conf.filePath?__fullPath+'/attachFiles/'+conf.filePath:'';   
40.                                     officeObj.LoadOriginalFile(__fullPath+"/attachFiles/" + tempPath,'doc');   
41.                                     officeObj.SetFieldValue("contents",filePath, "::FILE::");   
42.                                     //officeObj.SetFieldValue("red_header","","::ADDMARK::");   
43.                                     //officeObj.SetFieldValue("red_header",__fullPath+"/attachFiles/" + tempPath, "::FILE::");   
44.                                 }   
45.                             }   
46.                         ).show();   
47.                     }   
48.                 }   
49.             ]   
50.         });   
51.     }   
52.        
53.     Ext.applyIf(panelConf,conf);   
54.   
55.     var panel=new Ext.Panel(panelConf);   
56.     panel.on('afterrender',function(){   
57.             panel.body.appendChild(officeObj);   
58.             panel.doLayout();   
59.             var filePath=conf.filePath?__fullPath+'/attachFiles/'+conf.filePath:'';   
60.             var docType=conf.docType?conf.docType:'doc';   
61.             officeObj.LoadOriginalFile(filePath,docType);   
62.             panel.doLayout();   
63.                
64.     });   
65.     panel.on('destroy',function(){   
66.         try {   
67.                 officeObj.Close();   
68.             } catch (ex) {}   
69.     });   
70.        
71.     window.onunload=function(){   
72.         try {   
73.                 officeObj.Close();   
74.             } catch (ex) {}   
75.     };   
76.        
77.     //對外公共方法   
78.     return {   
79.         panel:panel,   
80.         officeObj:officeObj,   
81.         filePath:conf.filePath,   
82.         openDoc:function(path,type){   
83.             var vType='doc';   
84.             if(type){   
85.                 vType=type;   
86.             }   
87.             officeObj.LoadOriginalFile(path,type);   
88.         },   
89.         saveDoc:function(config){   
90.                 config=config||{};   
91.                 officeObj.HttpInit();   
92.                 officeObj.HttpAddPostString('file_cat', config.fileCat);   
93.                 //overwrite file path   
94.                 if(config.docPath!=null && config.docPath!=''){   
95.                     officeObj.HttpAddPostString('file_path', config.docPath);   
96.                 }   
97.                 officeObj.HttpAddPostCurrFile('AipFile','');       
98.                 var url=config.url ? config.url: __fullPath + '/file-upload';   
99.                 // 提交上傳文件   
100.                 returnValue = officeObj.HttpPost(url);   
101.                 var obj;   
102.                 eval('obj='+returnValue+";");   
103.                 return obj;   
104.         }   
105.     };   
106. };   
107.   
108. //Ext.reg('officepanel',OfficePanel);