Openbravo3.0 客户端代码开发与API
?
? ? ? ?一. 客戶端代碼開發工具
?
? ? ? Openbravo3.0客戶端代碼開發是大量的javascript代碼,CSS代碼和極少量的html代碼開發。我們是通過瀏覽器加載來查看客戶端主要的javascript代碼的,一般如下兩個工具選擇一個,Chrome Developers Tools和Firebug
?
?
? ? ? 二. smartclient源碼整合入Openbravo項目
?
? ? ? 1. 到如下地址將smartclient源碼下載下來:? https://code.openbravo.com/erp/mods/org.openbravo.userinterface.smartclient.dev/,點擊如下圖的zip即可。
? ? ? ?2. 將下載下來的smartclient源碼,解壓縮(注意先要重命名一下,名稱太長,解壓縮會報錯)放到openbravo項目的modules文件夾下面,比如:G:\openbravo3.0\Openbravo-3.0MP11\modules。
?
? ? ? ?3. 命令行窗口,切換到openbravo項目的頂層目錄,比如:G:\openbravo3.0\Openbravo-3.0MP11。運行如下命令:ant smartbuild。
?
? ? ? ?4. 編譯成功之后,刷新在eclipse里面的openbravo項目,可以在modules文件夾下面看到smartclient module。今后直接從這里查看smartclient的源碼。(可以使用Ctrl+Shift+r命令快速打開某一個源文件,比如FormItem.js)
?
?
? ? ? 三. ?客戶端獲取沒有壓縮和模糊的JS代碼
?
? ? ? openbravo會自動壓縮javascript代碼,為了減輕客戶端的加載壓力。但是,這回讓客戶端調試代碼更加困難,那么如何獲取沒有壓縮的javascript代碼。
? ? ? openbravo如果發現這個模塊不是開發狀態,就會壓縮javascript代碼。但是,如果是開發態就不會了。通常我們將如下幾個模塊設置成處于開發狀態:org.openbravo.client.kernel,org.openbravo.client.application,org.openbravo.userinterface.selector
? ? ? smartclient源碼在加載到客戶端的時候,通常會被壓縮。但是,客戶端調試的時候,非常需要看得見smartclient的源碼。為了能夠看到,需要安裝smartclient模塊,也就是第二步所說的。第二步做完之后,啟動服務,瀏覽器進入模塊管理頁簽,將smartclient模塊修改成處于開發狀態,然后重啟服務。
? ? ? 客戶端如何調試代碼,通過chrome瀏覽器打開某一個頁面之后,打開chrome開發人員工具,點擊scripts查看javascript代碼,下拉框找到一個名詞很長的javascript代碼,比如:27c45aef548fedad34ife42.js. 這個js代碼包含了整個壓縮了的js代碼。需要注意幾點:
? ? ? 1. 這個javascript名稱是動態生成的,內容變化,名稱就會變化,瀏覽器就會重新加載。
? ? ? 2. 如果這個文件是被壓縮的,請查看如上說的那三個通常說要設置成開發態的模塊是否設置了。
? ? ? 3. 這個文件不包含smartclient的源碼。
? ? ?找到這個js文件之后,在上面代碼搜索里面輸入this.messageBar = isc.OBMessageBar.create?,定位之后,在左邊數據行號的地方點擊右鍵就可以加斷點了,然后隨便打開一個窗口,就會觸發這個斷點。
?
?
? ? ? 四. 添加javascript到openbravo系統
?
? ? ? javascript加入到openbravo系統可以通過如下方式:
? ? ? 1. 靜態的javascript文件必須放在它所在模塊的如下目錄:web/[modulepackage]/js
? ? ? 2. javascript必須要注冊通過java語言,比如:
?
globalResources.add(createStaticResource("web/org.openbravo.client.application.examples/js/example-view-component.js", true));?
? ? ? ?五. openbravo客戶端javascriptAPI介紹
?
? ? ? ?當添加新的實例或者類的時候,需要遵守如下協議:
? ? ? ?1. 所有的全局數據必須加載全局對象OB里面。
? ? ? ?2. 所有CSS樣式命名必須以OB打頭。
? ? ? ?3. 所有的smartclient類命名必須以OB打頭。?
? ? ? ?在這一部分,我們將探討OB對象里面的功能函數。
?
? ? ? ?1. OB.Application
? ? ? ?它包含服務器端的一些基本信息,比如采用的是那種語言,基本訪問路徑是什么,系統版本之類的。見下圖:
? ? ??
?? ? ? 2. OB.User
? ? ? 包含當前登錄用戶的相關信息
? ? ??
?
? ? ? 3. OB.Constants
? ? ? 包含了在整個系統運作過程中會用到的常量。
?
? ? ? 4. OB.Datasource
? ? ? 提供標準和定制的數據源,它提供2個方法,create和get。
? ? ? get方法在獲取數據源的時候,會先判斷在客戶端是否已經緩存了,如果緩存了直接返回。如果沒有,則發生一個請求到服務端,要求服務端生成一個數據源返回。需要注意的是,這個get方法是異步的:
?
// ** {{{ OB.Datasource.get(dataSourceId, target, dsFieldName) }}} ** // // Retrieves a datasource from the server. The return from the server is a // javascript string which is evaluated. This string creates a datasource. The // datasource // object is set in a field of the target (if the target parameter is set). This // is done asynchronously. // // The method returns the datasourceid. // // Parameters: // * {{{dataSourceId}}}: the id or name of the datasource // * {{{target}}}: the target object which needs the datasource // * {{{dsFieldName}}}: the field name to set in the target object. // * {{{doNew}}}: if set to true then a new datasource is created // If not set then setDataSource or optionDataSource are used. // OB.Datasource.get = function(/* String */dataSourceId, /* Object */ target, /* String */dsFieldName, /*Boolean*/ doNew) { ... } ?? ? ? create方法不會調動服務器端來生成數據源,而是在客戶端自己生成,利用傳過來的參數
?
// ** {{{ OB.Datasource.create}}} ** // Performs a last check if the datasource was already registered before // actually creating it, prevents re-creating datasources when multiple // async requests are done for the same datasource. // Parameters: // * {{{dsProperties}}}: the properties of the datasource which needs to be // created. OB.Datasource.create = function(/* Object */dsProperties) {?
? ? OB.Datasource通過isc.OBRestDataSource來創建數據源,isc.OBRestDataSource繼承自SmartClient RestDatasource方法。
?
? ? ?5. OB.Format
? ? ?負責當前用戶全局日期,數字的格式設置, 特殊字段的設置在format.xml里面設置,
? ? ?
?
? ? ? 6. OB.I18N
? ? ? 改對象提供一個getLabel方法,用于獲取一個翻譯過的提示信息,當用戶加載一個窗口的時候,系統會自動調用這個方法將提示信息下載下來。方便今后使用。
?
? ? ? 7. OB.PropertyStore
? ? ? 負責獲取和設置一些屬性值。
? ? ? get方法,可以返回一個特定窗口的某一個屬性值。
dataPageSizeaux = OB.PropertyStore.get('dataPageSize',this.view.windowId);? ? ? set方法,?function(propertyName, value, windowId, noSetInServer, setAsSystem):設置某一個屬性值。如果不需要設置服務器端這個屬性的值,noSetInServer為true. 如果要在系統中都設置,setAsSystem為true.
? ? ??OB.PropertyStore.set('OBUIAPP_GridConfiguration', result, this.windowId);
? ? ? OB.PropertyStore可以加監聽, 值改變的時候會通知監聽對象。
?
? ? ? 8. OB.RemoteCallManager
? ? ? 負責調用服務端的方法,提供一個Call方法,有如下參數:
? ? ? actionName:接收請求處理的類名。
? ? ? data:請求的表體數據
? ? ? requestParams:請求的參數
? ? ? callback:請求返回時,調用的方法
? ? ? callContext
?
? ? ? 9. OB.ViewManager
? ? ? 管理我們打開的所有頁簽,像回退,刷新頁面也屬于它的管轄范圍。它有一個比較重要的方法是打開一個頁簽,openView(viewName, params), viewName: 將要創建“視圖”的名稱。params: 創建“視圖”需要的一些數據。頁簽也就是視圖,有一個屬性showItSelf,如果設置成true,那么就是彈出窗口。如果false,那么就會在頁簽里面打開視圖。
?
? ? ? 10.OB.Utilities.Action
? ? ? 用來定義一系列動作執行方法,定義方法如下:
?
OB.Utilities.Action.set('showAlert', function (paramObj) {alert(paramObj.text); });?
? ? 執行方法如下:
?
OB.Utilities.Action.execute('showAlert', {'text': 'This is just an example'});?
? ? executeJSON方法可以順序執行多個方法,如下:
?
OB.Utilities.Action.executeJSON([{'showAlert': {'text': 'This is the first alert'}}, {'showAlert': {'text': 'This is the second alert'}}])?
? ? ? 當調用executeJSON方法的時候,會生成一個線程,全程監控執行過程。這個線程可以中止執行,暫停執行和繼續執行。比如:
?
OB.Utilities.Action.set('confirmDialog', function(paramObj) {var text = 'Hello ' + paramObj.name + ', do you want to continue with the thread?';if (!confirm(text)) {OB.Utilities.Action.cancelThread(paramObj.threadId);} });OB.Utilities.Action.set('promptDialog', function(paramObj) {var text = '';if (paramObj.value) {text += 'You have introduced: ' + paramObj.value + '\n';}text += 'Please, introduce here a 0 in order to continue'paramObj.value = prompt(text);if (paramObj.value === '0') {OB.Utilities.Action.resumeThread(paramObj.threadId);} else {OB.Utilities.Action.pauseThread(paramObj.threadId);OB.Utilities.Action.execute('promptDialog', paramObj, 100);} });OB.Utilities.Action.set('alertDialog', function(paramObj) {var text = 'You have finished the thread!\nBye ' + paramObj.name;alert(text); });OB.Utilities.Action.executeJSON([{'confirmDialog': {name: 'John Smith'}},{'promptDialog': {}},{'alertDialog': {name: 'John Smith'}} ]);?
? ? ? 11. OB.Utilities.Number
? ? ? 提供幾個方法用來格式化數字,比如:
? ? ??OB.Utilities.Number.roundJSNumber(num, dec)將數字num按照dec設置的精度處理。
? ? ??OB.Utilities.Number.OBMaskedToJS(numberStr, decSeparator, groupSeparator):將OB中格式的數字轉換成JS中的格式。
? ? ??OB.Utilities.Number.JSToOBMasked(number, maskNumeric, decSeparator, groupSeparator, groupInterval):將JS格式的數字轉換成OB中的格式。
?
? ? ? ?12. OB.Utilities.Date
? ? ? ?格式化日期,比如:
? ? ? ?OB.Utilities.Date.OBToJS(OBDate, dateFormat):將OB中date的格式轉換成JS中的格式
? ? ? ?OB.Utilities.Date.JSToOB(SDate, dateFormat):?反之。
?
? ? ? ?13. OBGrid
? ? ? ?OBGrid是openbravo中的表格定義類,如果你要實現自己的表格類,必須繼承它,以保證你的表格跟系統中的表格風格一樣。
?
? ? ? 14. Openbravo Window Components?
? ? ? Openbravo里面的一個窗口是由多個頁簽組成,每一個頁簽有編輯模式和表格模式,另外,還有工具欄和消息框。下面具體介紹一下這些信息。
?
? ? ? OBStandardWindow:窗口對象
? ? ? Openbravo里面的窗口是通過實例化窗口對象創建的,窗口對象里面的頁簽是通過實例化OBStandardView創建的。每一個頁簽對象里面包含了多個子頁簽,每一個頁簽通過實例化OBViewGrid來實現表格模式和實例化OBViewForm來實現編輯模式。窗口對象一般包含以下屬性:
? ? ? 1. WindowId:窗口存儲在數據庫中對應的id
? ? ? 2. view:根頁簽
? ? ? 3. views:窗口中所有的頁簽
?
? ? ? OBStandardView:頁簽對象
? ? ? 頁簽對象包含以下一些信息:
? ? ? a form(一個編輯頁面),a grid(一個表格頁面),a tab set with tabs(一個包含頁簽的頁簽集合),a message bar(消息顯示條),a toolbar(工具欄)
? ? ? OBStandardView有如下屬性:
? ? ? tabId:tab ID
? ? ? tabTitle:頁簽的標題
? ? ? StandardWindow:一個返回所屬窗口的鏈接
? ? ? childTabSet:所有子頁簽集合
? ? ? parentView:一個返回父頁簽的鏈接,如果是子頁簽
? ? ? parentTabSet:一個返回父頁簽所有子頁簽集合的鏈接
? ? ? toolBar:本頁簽OBToolBar實例化對象
? ? ? messageBar:消息框
? ? ? viewForm:編輯頁面
? ? ? viewGrid:列表頁面
? ? ? dataSource:為編輯頁面和列表頁面提供數據
? ? ? isActiveView:一個方法,如果頁簽是活動的返回true
?
? ? ? OBViewGrid:表格頁面
? ? ? OBViewGrid是smartclient ListGrid的子類,除開listGrid的屬性外,它還有額外的屬性:
? ? ? setItemValue(item,value)方法:為item設值,并觸發onChange事件。
? ? ? getSelectedRecord:得到當前選中行
? ? ? getEditForm:當編輯表格某一行的時候,返回當前編輯的一行信息
? ? ? getEditRow:得到當前編輯的行
? ? ? setValue(item,value),設置item的值,不觸發onChange事件
?
? ? ? OBViewForm:編輯頁面
? ? ? OBViewForm是DynamicForm的一個子類,有如下重要屬性:
? ? ? view:指向所屬頁簽
? ? ? gird:
? ? ? hasChanged:如果至少有一個字段的值改變,則為ture
? ? ? isNew:the form是否是為了新增一條記錄而打開
?
? ? ? OBMessageBar:提示信息框
? ? ? 給予用戶一些提示信息,比如警告,錯誤等等。它有如下方法:
? ? ? setType(type):設置消息的類型,不同類型的消息顏色和圖標不同,type有如下幾種: isc.OBMessageBar.TYPE_SUCCESS,TYPE_ERROR,TYPE_WARNING,TYPE_INFO.
? ? ? setText(title,text):設置提示信息框的內容,和標題,如果標題為空,則設置為默認的
? ? ? setMessage(type,title,text):上述兩方法結合,同時會顯示消息框
? ? ? hide/show:隱藏或者顯示消息框。
?
? ? ? OBToolBar:工具欄
? ? ? 窗口中的每一個頁簽都有一個工具欄,但是窗口只顯示一個工具欄。當前活動的頁簽,的工具欄才會顯示,如果不是活動頁簽,它所屬的工具欄就會隱藏。
?
?
?
?
總結
以上是生活随笔為你收集整理的Openbravo3.0 客户端代码开发与API的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: Unity关于Layer的管理
- 下一篇: 这个夏天,飞到北纬18°去玩海——带着小