trswcm6.5及以上二次開發(fā)-003頂部菜單

1、修訂序號(hào)變更日期變更動(dòng)作變更內(nèi)容詳情描述版本1.2010-04-25DEV2新建新建本文檔1.02.2011-01-12修改X。X。1 頂部菜單定制1.1 概述本節(jié)介紹了WCMV65 頂部菜單的相關(guān)知識(shí)，如果你需要對(duì)頂部菜單進(jìn)行修改，或者添加一些新的菜單，你將這節(jié)中找到。頂部菜單包含了 WCM 幾乎所有操作的入口，其中的菜單項(xiàng)，分成兩種類型，一種菜單項(xiàng)的內(nèi)容是固定不變的，比如菜單項(xiàng)“我的信息”等，如：圖 1；另一種菜單項(xiàng)的內(nèi)容或樣式隨著列表主區(qū)域選擇對(duì)象的不同而動(dòng)態(tài)改變，比如站點(diǎn)列表下，當(dāng)列表中選擇一個(gè)對(duì)象和多個(gè)對(duì)象時(shí)，菜單項(xiàng)將出現(xiàn)針對(duì)一個(gè)對(duì)象的操作和多個(gè)對(duì)象的操作，如圖 2 和圖 3。圖 1

2、 固定的菜單項(xiàng)圖 2 選擇一個(gè)站點(diǎn)時(shí)的“操作任務(wù)”菜單項(xiàng)圖 3 選擇多個(gè)站點(diǎn)時(shí)的“操作任務(wù)”菜單項(xiàng)1.1.1 菜單定制涉及到的文件頂部菜單涉及到的文件都在 wcm/app/js/data/目錄下，其中 sys.js 包含了幾。其它的 js 文件均為針對(duì)某個(gè) wcm 對(duì)象自身的操作，比如：乎所有的菜單項(xiàng)website.js 包含了站點(diǎn)的新建和導(dǎo)入等操作?？梢愿鶕?jù)需要向這個(gè)目錄添加新的 js 文件以便新的菜單項(xiàng)。1.1.2 菜單項(xiàng)時(shí)的 json 屬性描述屬性名類型說明typeString當(dāng)前菜單項(xiàng)的類型，可選值為：checkItem復(fù)選類型的菜單項(xiàng)radioItem單選類型的菜單項(xiàng)dynamic需

3、要?jiǎng)討B(tài)加載的菜單項(xiàng)，經(jīng)常配合 items 屬性使用separate菜單中的分割線其他值或無值普通菜單項(xiàng)keyString全局唯一的菜單標(biāo)識(shí)，為必需屬性descString菜單的顯示內(nèi)容，為必需屬性parentString當(dāng)前菜單項(xiàng)需要到的父菜單 key 信息，頂級(jí)菜單項(xiàng)可不包含此屬性hotKeyString當(dāng)前菜單項(xiàng)的快捷鍵，僅對(duì)頂級(jí)菜單項(xiàng)有效1.1.3 菜單項(xiàng)示例說明效果限：無權(quán)限：代碼reg(key : autoinfor,效果代碼reg(key : BZ,desc : wcm.LANGSYS_38 | 幫助, hotKey : H,order : 9);說明reg 是前面定義的一個(gè)菜單函

4、數(shù)；此處表示了一個(gè)“幫助”菜單項(xiàng)； BZ 為全局唯一的標(biāo)識(shí)信息；wcm.LANG 為多語言支持而定義的變量，二次開發(fā)時(shí)一般可以不考慮，只需要寫上后面的“幫助”漢字即可，所以后面的示例，將不再帶上此屬性；hotKey 是為該菜單項(xiàng)定義的快捷鍵，表示按下 Alt+H 鍵將顯示此幫助菜單的子菜單項(xiàng)；order 表示“幫助”菜單項(xiàng)將出現(xiàn)在菜單組的第九位orderNumber當(dāng)前菜單項(xiàng)在父菜單項(xiàng)下出現(xiàn)的順序，為可選屬性，默認(rèn)添加到當(dāng)前父菜單下項(xiàng)最后面itemsArray/Function如果當(dāng)前菜單項(xiàng)為普通菜單項(xiàng)，則表示該菜單項(xiàng)下的子菜單項(xiàng)，items 為子菜單項(xiàng)的 json 數(shù)組；如果當(dāng)前菜單項(xiàng)為 d

5、ynamic 菜單項(xiàng)，items 表示需要?jiǎng)討B(tài)加載的同級(jí)菜單項(xiàng)；clsFunction顯示菜單之前給當(dāng)前菜單項(xiàng)動(dòng)態(tài)添加的樣式，系統(tǒng)默認(rèn)提供了樣式checkItem（多選）、radioItem(單選)、disabled（菜單灰化），可根據(jù)需要使用自定義樣式。如：某些菜單項(xiàng)在普通用戶登錄時(shí)，添加 disabled 樣式，以讓該菜單失效cmdFunction單擊當(dāng)前菜單項(xiàng)時(shí)，執(zhí)行的處理函數(shù)，函數(shù)參數(shù)為：wcmEvent當(dāng)前列表頁面加載完成時(shí)，向操作面板發(fā)送的 event 對(duì)象，可從中獲取列表頁面中當(dāng)前選中的對(duì)象個(gè)數(shù)及對(duì)象信息ode當(dāng)前單擊操作所單擊的菜單項(xiàng)的 dom節(jié)點(diǎn)當(dāng)前 this 上下文為該菜單

6、項(xiàng)的 item 自身效果代碼reg(key : CZRW,desc : 操作任務(wù),hotKey : O, order : 2, items: key : add, desc : 新建, order : 1,key : import,desc : 導(dǎo)入, order : 2,key : export,desc : 導(dǎo)出, order : 3,type : separate, order : 4,desc : 智能信息處理選件, parent : XJ,order : 3,cmd : function(event) skipTo(Path:autoInfor,0);,cls : function(

7、event,ode) var dom = Ext.fly(ode);domhasOperRight(autoInfor) ? addClass : removeClass(disabled););說明此處表示了一個(gè)“智能信息處理選件”菜單項(xiàng)；parent 表示將該菜單項(xiàng)注冊(cè)到“選件”菜單項(xiàng)下（因?yàn)椤癤J”是選件菜單項(xiàng)的唯一標(biāo)識(shí)）；cmd 表示單擊該菜單項(xiàng)時(shí)執(zhí)行的處理，此處的 skipTo 函數(shù)調(diào)用的效果是彈出一個(gè) wcm65的控制管理頁面；cls 函數(shù)用來在菜單顯示之前給菜單項(xiàng)動(dòng)態(tài)添加的樣式，此處在有智能信息處理選件權(quán)限時(shí)，移除了菜單項(xiàng)的 disabled 樣式，否則添加了該樣式，disabl

8、ed 是系統(tǒng)默認(rèn)自帶的樣式，當(dāng)有此樣式時(shí)，單擊菜單項(xiàng)將失效，即不執(zhí)行它的 cmd 處理，當(dāng)然你也完全可以在此處為菜單添加自己定義的樣式，如：在此處將菜單項(xiàng)的字體變成紅色等1.2 實(shí)戰(zhàn)：如何修改或添加一個(gè)頂部菜單項(xiàng)1.2.1 如何修改一個(gè)已有的菜單項(xiàng)將“幫助”下的“1） 由于菜單的 文件中，所以反饋”菜單項(xiàng)改成“都在wcm/app/js/data/可以嘗試先在 sys反饋定制”，同時(shí)字體變成“紅色”的都在 sys.js目錄下，同時(shí).js 搜索“反饋”或?qū)⑺阉鞣秶潭ㄔ谀夸?，找到相?yīng)的項(xiàng)；2） 修改相應(yīng)項(xiàng)，請(qǐng)對(duì)比下面修改前后的變化，其中的粗體是修改過的部分修改前reg(key : backfeed

9、Online,desc : wcm.LANGSYS_39 | 反饋, parent : BZ,order : 1,cmd : function(event)window.open(.cn,.hostname + backfeedOnline););key : opers, type : dynamic, order : 5,items : function(event)/根據(jù)event 對(duì)象，返回需要?jiǎng)討B(tài)添加的菜單項(xiàng));說明此處表示 了“操作任務(wù)”菜單項(xiàng)；items 表示給“操作任務(wù)”菜單項(xiàng)添加了“新建”、“導(dǎo)入”等子菜單項(xiàng)，之所以“新建”等菜單項(xiàng)還會(huì)有子菜單項(xiàng)，是因?yàn)楹竺鎸?duì)它們又 了子菜單項(xiàng)

10、1.2.2 如何添加一個(gè)菜單項(xiàng)在“幫助”菜單項(xiàng)下，添加一個(gè)到“”的，并且只有當(dāng)前用戶是“管理員”時(shí)才能正確到“”，否則單擊無效1)在 wcm/app/js/data/目錄下添加一個(gè) js 文件，并取一個(gè)適當(dāng)名稱，如：extend.js（wcm65 的版本分為開發(fā)版本和發(fā)布版本，在 wcm65 的開發(fā)版本，wcm 默認(rèn)會(huì)加載目錄下的所有文件，所以對(duì)開發(fā)版本而言此處添加的 js 文件在再次wcm 時(shí)會(huì)自動(dòng)加載；發(fā)布版本需要運(yùn)行一個(gè) jsp 以生成合并之后的 js，見步驟 3。兩種版本下均不需要再在頁面種引入剛添加的 js 文件）在 extend.js 文件中添加如下 js 代碼，注意將文件編碼設(shè)置

11、為 utf-82)代碼(function()var reg = wcm.View.register.bind(wcm.View); reg(key : baidu,desc : ,parent : BZ, order : 4,修改后reg(key : backfeedOnline, desc : 反饋定制,parent : BZ,order : 1,cls : function(event,ode) ode.style.color = red;,cmd : function(event)window.open(.cn,.hostname + backfeedOnline););3)無需重啟，只

12、需要運(yùn)行下./ wcm / wcm_use 目錄下的wcm61_gen_runtime.jsp，合并 js 即可。刷新 wcm 頁面再次，即可看到上面的效果。cls : function(event,ode)var isAdmin = wcm.AuthServer.isAdmin(); var sMethod = isAdmin ? removeClass :addClass;Ext.fly(ode)sMethod(disabled);,cmd : function(event)window.open(ht););)();說明a) (function()/)();表示一個(gè)執(zhí)行體，和普通的執(zhí)行語句沒 大的區(qū)別，此處只是為了產(chǎn)生一個(gè)外界不能 的作用域?qū)⒆兞?reg 定義為一個(gè)函數(shù)，reg 其實(shí)和函數(shù) wcm. View.register 的作用完全相同，此處只是為了使用一個(gè)簡(jiǎn)潔的函數(shù)名程調(diào)用 reg 函數(shù)，并將定義的菜單配置 json 作為參數(shù)函數(shù) cls 中