經一周的研究學習,看了國內的H+、HUI等,國外的PaperDashboardPro、Make、Metronic BootStrap等,最終選定用一個輕量的,適合中國人的,來自DTcms的后台管理UI來改造吉日嘎拉的通用權限管理Web端的UI。
js+css+圖片文件如下
新增一個Menu.ashx文件,用於輸出當前用戶權限可以查看的所有菜單。
新增Main.aspx文件用於主框架,所有內容也放在名為fraContent的iframe中。其它涉及的登錄跳轉小修改暫時略過。
有圖有真相,先上圖:
左側菜單折疊后
針對原DTcms的UI改進:
1、頂部菜單擴展DTcms功能,點擊后不僅可使左側菜單變化,還能打開鏈接地址。
2、左側的1級、2級鏈接也增加了打開鏈接功能。
3、折疊后的頂部菜單增加logo/splash的顯示,同時對於低於800分辨率的屏幕(如手機)隱藏此功能
4、右下角的彈出菜單頂級、一級、二級、底級都能打開鏈接
由於這個界面還算比較跟得上節奏,再加上國內有幾千程序用戶都用過這個DTcms,就毫不猶豫升級到旺財珠寶庫存管理系統,但保留原UI,喜歡老UI的用戶可以在右上角切換。