FoxOne---一個快速高效的BS框架


FoxOne---一個快速高效的BS框架--(1)

FoxOne---一個快速高效的BS框架--(2)

FoxOne---一個快速高效的BS框架--(3)

FoxOne---一個快速高效的BS框架--(4)

FoxOne---一個快速高效的BS框架--WEB控件屬性編輯器

FoxOne---一個快速高效的BS框架--數據訪問(Dao)

FoxOne---一個快速高效的BS框架--生成增刪改查

 

最近一段時間內,我都在花時間開發一個快速的BS開發框架,我將她命名為FoxOne,她基於ASP.NET MVC,支持SQL SERVER,MY SQL,ORACLE等主流數據庫;

具有數據訪問,日志記錄,環境變量,基於角色的訪問控制(頁面,控件,數據,支持分級授權),眾多的控件(Table,Form,Tree,Tab,Panel,ToolTip.....),等一般的BS開發框架常見的功能,除此之外,我還開發了一套可以在線設計頁面的設計器,這是FOXONE最強大的地方,下面我將演示如何在最短時間內快速通過在線設計的方式配置出一個樹型列表頁面。

首先在頁面設計中新建一個頁面,其中頁面地址是以后將會用於URL訪問的地址(如下列的頁面將來的地址為/Page/TastPage),標題為頁面的title

保存后我們就新建好了一個頁面。

接下來我們進入頁面的設計界面

 

進來后,默認已經出現了我們選擇的布局類型,其中有”添加組件“的按鈕的地方,就是可以在里面添加控件的區域,如下圖如示:

我們先要在左邊添加一個樹型控件,注意在組件列表中,我已經為FOXONE默認添加了十幾個我們在做這種企業管理系統常用到的控件,而且支持擴展,只要實現PageControlBase基類,所有擴展的控件也會在這里出現:

 保存后,右邊的樹型控件的屬性設置區域,會進一步出現其它復雜屬性的設置,例如:數據源。在FOXONE中,所有的數據源都分為三類,一類是可以為樹型控件填充數據源的ICascadeDataSource,一類為下拉框,單選框,多選框提供數據源的IKeyValueDataSource,最后一類是為列表提供數據源的IListDataSource,所有實現這三類接口的數據源,在設計器中都會在相應的控件要用到的地方出現以供選擇。在下面的示例中我們直接使用數據表數據源。

然后描述一下在對應樹型控件的id,name,pId的字段分別是什么。最后保存就行了

這時候我們來看一下頁面的效果

其實,對於數據源,我還設計了N個默認的過濾器,對數據源可以進行一些簡單的數據過濾,在此先不演示。

繼續在右邊添加表格控件,如下圖,我們先使用”自動生成列“(意思是直接顯示數據源返回的所有列,這有點像ASP.NET WEBFORM的GridView的AutoGenerateColumn)

保存后,為表格選擇一種數據源,繼續用數據表,如下圖

選擇好后,直接保存,這時候頁面的效果就出來了,如下圖

 上圖的效果中,表格還有幾個問題:

1.有N多列是不想顯示的

2.列頭要重命名

3.某些列的值要轉換后再顯示(如ParentId列,應該顯示父級名稱,不是父級ID)

4.某些列的顯示要格式化

下面我們一一來修改這些問題,首先,我們要把”自動生成列“改為”否“

然后切換到”表格列“選項卡,點”從數據源獲取列“, 這時候會自動從指定好的數據源中把每一列取回來,這時候我們可以對這些列進行增刪配置,

我們先刪掉一列不需要的列,剩下的列如下圖:

這時候我們來看看頁面的效果:

好,已經顯示了指定的列了,現在對列名進行修改:

列名重命名為”組織名稱“,然后順便演示一下輸出格式的玩法,這個是參照ASP.NET WEBFORM的GridView的列格式化了

順便把”最后更新時間“的格式和列名也改一下,

這時候再來看看效果:注意 組織名稱 那一列已經都多了個hello world了,最后更新時間也按照指定的格式顯示了。

下面來修改下一個問題,我們要對ParentId列進行轉換,把父級ID 轉為 父級名稱,點開列編輯,切換到”列轉換器“那一欄,FOXONE默認已經集成了幾個常用的列轉換,如:用戶名稱,組織名稱,角色名稱,數據字典,枚舉等等。

設置好轉換器后,再來看一下效果,這時候父級列已經是顯示名稱了。

上面的圖中還有Status列是編碼,這一列的值來自系統中的枚舉,所以進它進行枚舉轉換,如下圖

綁定好轉換器后,列值也發生了變化,如下圖

最后要讓左邊的樹的點擊引起右邊表格控件的聯動變化,這時候需要出來頁面的基礎信息里添加一小段JS,指定樹型控件的nodeClick事件響應,在里面對table進行條件干涉,然后讓table重新刷新(其實就是把參數拼起來,通過POST的方式提交到后台,讓TABLE的數據源重新綁定一次),順便提一句,這里的所有控件都是局部刷新的,但肯定不是像ASP.NET WEBFORM的那種局部刷新實現得這么爛。。。

同時也要給表格控件的數據源添加一個過濾器,這個過濾器是FOXONE默認有的,會自動根據當前FORM和URL參數中的值對數據源的某些列進行字段一一匹配過濾,當前這些過濾器,數據源,轉換器等等都是實現某一接口的,可以非常方便進行擴展。

最后看一下點擊樹控件的效果。。。

這只是FOXONE冰山一角的內容,如果覺得這個框架有存在的意義,就頂起來吧,我會寫多點文章,這個框架目前在公司使用8個月,同時也是支持原來的MVC開發的,而且很多配置好的頁面和控件都可以局部引用到自己開發的頁面中去使用。。

 

 如果有興趣的可以加入群里來交流一下,群號:581523872

github:https://github.com/gameking0124/FoxOne

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM