Openbravo3.0 客户端代码开发与API
?
? ? ? ?一. 客戶端代碼開發(fā)工具
?
? ? ? Openbravo3.0客戶端代碼開發(fā)是大量的javascript代碼，CSS代碼和極少量的html代碼開發(fā)。我們是通過瀏覽器加載來查看客戶端主要的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如果發(fā)現這個模塊不是開發(fā)狀態(tài)，就會壓縮javascript代碼。但是，如果是開發(fā)態(tài)就不會了。通常我們將如下幾個模塊設置成處于開發(fā)狀態(tài)：org.openbravo.client.kernel，org.openbravo.client.application，org.openbravo.userinterface.selector
? ? ? smartclient源碼在加載到客戶端的時候，通常會被壓縮。但是，客戶端調試的時候，非常需要看得見smartclient的源碼。為了能夠看到，需要安裝smartclient模塊，也就是第二步所說的。第二步做完之后，啟動服務，瀏覽器進入模塊管理頁簽，將smartclient模塊修改成處于開發(fā)狀態(tài)，然后重啟服務。
? ? ? 客戶端如何調試代碼，通過chrome瀏覽器打開某一個頁面之后，打開chrome開發(fā)人員工具，點擊scripts查看javascript代碼，下拉框找到一個名詞很長的javascript代碼，比如：27c45aef548fedad34ife42.js. 這個js代碼包含了整個壓縮了的js代碼。需要注意幾點：
? ? ? 1. 這個javascript名稱是動態(tài)生成的，內容變化，名稱就會變化，瀏覽器就會重新加載。
? ? ? 2. 如果這個文件是被壓縮的，請查看如上說的那三個通常說要設置成開發(fā)態(tài)的模塊是否設置了。
? ? ? 3. 這個文件不包含smartclient的源碼。
? ? ?找到這個js文件之后，在上面代碼搜索里面輸入this.messageBar = isc.OBMessageBar.create?，定位之后，在左邊數據行號的地方點擊右鍵就可以加斷點了，然后隨便打開一個窗口，就會觸發(fā)這個斷點。
?
?
? ? ? 四. 添加javascript到openbravo系統(tǒng)
?
? ? ? javascript加入到openbravo系統(tǒng)可以通過如下方式：
? ? ? 1. 靜態(tài)的javascript文件必須放在它所在模塊的如下目錄：web/[modulepackage]/js
? ? ? 2. javascript必須要注冊通過java語言，比如：
?
globalResources.add(createStaticResource("web/org.openbravo.client.application.examples/js/example-view-component.js", true));?
? ? ? ?五. openbravo客戶端javascriptAPI介紹
?
? ? ? ?當添加新的實例或者類的時候，需要遵守如下協(xié)議：
? ? ? ?1. 所有的全局數據必須加載全局對象OB里面。
? ? ? ?2. 所有CSS樣式命名必須以OB打頭。
? ? ? ?3. 所有的smartclient類命名必須以OB打頭。?
? ? ? ?在這一部分，我們將探討OB對象里面的功能函數。
?
? ? ? ?1. OB.Application
? ? ? ?它包含服務器端的一些基本信息，比如采用的是那種語言，基本訪問路徑是什么，系統(tǒng)版本之類的。見下圖：
? ? ??
?? ? ? 2. OB.User
? ? ? 包含當前登錄用戶的相關信息
? ? ??
?
? ? ? 3. OB.Constants
? ? ? 包含了在整個系統(tǒng)運作過程中會用到的常量。
?
? ? ? 4. OB.Datasource
? ? ? 提供標準和定制的數據源，它提供2個方法，create和get。
? ? ? get方法在獲取數據源的時候，會先判斷在客戶端是否已經緩存了，如果緩存了直接返回。如果沒有，則發(fā)生一個請求到服務端，要求服務端生成一個數據源返回。需要注意的是，這個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來創(chuàng)建數據源，isc.OBRestDataSource繼承自SmartClient RestDatasource方法。
?
? ? ?5. OB.Format
? ? ?負責當前用戶全局日期，數字的格式設置， 特殊字段的設置在format.xml里面設置，
? ? ?
?
? ? ? 6. OB.I18N
? ? ? 改對象提供一個getLabel方法，用于獲取一個翻譯過的提示信息，當用戶加載一個窗口的時候，系統(tǒng)會自動調用這個方法將提示信息下載下來。方便今后使用。
?
? ? ? 7. OB.PropertyStore
? ? ? 負責獲取和設置一些屬性值。
? ? ? get方法，可以返回一個特定窗口的某一個屬性值。
dataPageSizeaux = OB.PropertyStore.get('dataPageSize',this.view.windowId);? ? ? set方法，?function(propertyName, value, windowId, noSetInServer, setAsSystem):設置某一個屬性值。如果不需要設置服務器端這個屬性的值，noSetInServer為true. 如果要在系統(tǒng)中都設置，setAsSystem為true.
? ? ??OB.PropertyStore.set('OBUIAPP_GridConfiguration', result, this.windowId);
? ? ? OB.PropertyStore可以加監(jiān)聽， 值改變的時候會通知監(jiān)聽對象。
?
? ? ? 8. OB.RemoteCallManager
? ? ? 負責調用服務端的方法，提供一個Call方法，有如下參數：
? ? ? actionName：接收請求處理的類名。
? ? ? data：請求的表體數據
? ? ? requestParams：請求的參數
? ? ? callback：請求返回時，調用的方法
? ? ? callContext
?
? ? ? 9. OB.ViewManager
? ? ? 管理我們打開的所有頁簽，像回退，刷新頁面也屬于它的管轄范圍。它有一個比較重要的方法是打開一個頁簽，openView(viewName, params), viewName: 將要創(chuàng)建“視圖”的名稱。params: 創(chuàng)建“視圖”需要的一些數據。頁簽也就是視圖，有一個屬性showItSelf，如果設置成true，那么就是彈出窗口。如果false，那么就會在頁簽里面打開視圖。
?
? ? ? 10.OB.Utilities.Action
? ? ? 用來定義一系列動作執(zhí)行方法，定義方法如下：
?
OB.Utilities.Action.set('showAlert', function (paramObj) {alert(paramObj.text); });?
? ? 執(zhí)行方法如下：
?
OB.Utilities.Action.execute('showAlert', {'text': 'This is just an example'});?
? ? executeJSON方法可以順序執(zhí)行多個方法,如下：
?
OB.Utilities.Action.executeJSON([{'showAlert': {'text': 'This is the first alert'}}, {'showAlert': {'text': 'This is the second alert'}}])?
? ? ? 當調用executeJSON方法的時候，會生成一個線程，全程監(jiān)控執(zhí)行過程。這個線程可以中止執(zhí)行，暫停執(zhí)行和繼續(xù)執(zhí)行。比如：
?
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中的表格定義類，如果你要實現自己的表格類，必須繼承它，以保證你的表格跟系統(tǒng)中的表格風格一樣。
?
? ? ? 14. Openbravo Window Components?
? ? ? Openbravo里面的一個窗口是由多個頁簽組成，每一個頁簽有編輯模式和表格模式，另外，還有工具欄和消息框。下面具體介紹一下這些信息。
?
? ? ? OBStandardWindow：窗口對象
? ? ? Openbravo里面的窗口是通過實例化窗口對象創(chuàng)建的，窗口對象里面的頁簽是通過實例化OBStandardView創(chuàng)建的。每一個頁簽對象里面包含了多個子頁簽，每一個頁簽通過實例化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設值，并觸發(fā)onChange事件。
? ? ? getSelectedRecord：得到當前選中行
? ? ? getEditForm：當編輯表格某一行的時候，返回當前編輯的一行信息
? ? ? getEditRow：得到當前編輯的行
? ? ? setValue(item,value),設置item的值，不觸發(fā)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°去玩海——带着小