第一篇博客只是粗略說明了一下,其實這個工具真正用話可能大家還要細看下,我今天(連夜)寫個例子,截幾個圖,做一下自定義模板的實例教程,因為代碼生成本身是個工具,動畫效果都是次要的,主要是工具本身,其中自帶的模板並不適合所有開發環境,所以還是側重模板編寫和接口。
前面說到我要寫個MVC前台的模板按表生成 Index.cshtml 和 Controller.cs,所以就那這兩個做個例子。說到模板就是一個制式的文件,我要先做錯一個標准文件作為模板,然后根據不同表生成自己的文件, 其實大家都是程序員說這都是廢話,博客比較長,說明的比較細,截圖多,最下面有源碼
環境准備,我先搭了一個FineUI的空項目 CodeFDemo

用生成工具生成了 asset_a2 表的后台三層

添加到項目,生成,該表是一個資產分類表

第一步 做一個模板的真實頁面
准備工作做完,再做一個前台展示頁面,以此為標准制作模板文件

Index.cshtml
@{ ViewBag.Title = "Index"; var F = Html.F(); } @section head { } @section body { @( F.Panel() .IsViewPort(true) .ShowBorder(false) .ShowHeader(false) .Layout(LayoutType.Region) .Items( //中間Panel 查詢和列表 F.Panel() //.IsViewPort(true) .BoxFlex(4) .Layout(LayoutType.VBox) .BodyPadding(0)//5 .BoxConfigChildMargin("0 0 0 0")//0 0 5 0 .ShowBorder(false) .ShowHeader(false) .Items( //查詢表單 F.Form() .ID("searchForm").Title("查詢條件") .BodyPadding(5).BoxConfigChildMargin("0 5 0 5").BoxFlex(1) .Layout(LayoutType.VBox) .BoxConfigAlign(BoxLayoutAlign.Stretch).BoxConfigPosition(BoxLayoutPosition.Center) .EnableCollapse(true) .LabelWidth(100) .RowsEx(4, F.TextBox() .ID("txtstr20") .Attribute("data", "SYS_ASSET_A1_160") .Label("分類名稱") .EmptyText("分類名稱"), F.TextBox() .ID("txtstr20") .Attribute("data", "SYS_ASSET_A1_160") .Label("分類編號") .EmptyText("分類編號") ) , //列表 F.Grid() .Title("列表") .ID("Grid1") .BoxFlex(6) .EnableCheckBoxSelect(true) .DataIDField("ASSET_A2_AUTOID") .AllowPaging(true) .EnableHeaderMenu(false) .PageSize(15) .Toolbars( F.Toolbar().Items( F.DefaultGridBtn("Grid1") ) ) .Columns( F.RowNumberField(), F.RenderField() .HeaderText("ID") .Hidden(true) .DataField("ASSET_A2_AUTOID"), F.RenderField() .HeaderText("分類名稱") .ExpandUnusedSpace(true) .DataField("ASSET_A2_10"), F.RenderField() .HeaderText("分類編號") .ExpandUnusedSpace(true) .DataField("ASSET_A2_20"), F.RenderField() .HeaderText("新增時間") .ExpandUnusedSpace(true) .DataField("ASSET_A2_MAKETIME") ) .DataSource(ViewBag.griddata) //.Listener("rowclick", "OnGrid1RowClick") ) ) ) } @section script { <script> F.ready(function () { }) //列表行點擊事件 function OnGrid1RowClick(e, rowid) { F.doPostBack('@Url.Action("Grid1_RowClick")', { rowid: rowid, fields: F.ui.Grid1.fields }); } //列表新增 function Grid1new_Click() { F.ui.Grid1.showEdit();//新增 } //列表修改 得到列表選中項 getSelectedRows 注意DataIDField屬性 function Grid1edit_Click(g,rowid) { F.ui.Grid1.showEdit(true);//修改 } //刪除 刪除此方法自動回發Grid1Del_Click 方法 參數為 id fields function Grid1delete_Click(g,ids) { } //刷新列表 function lodeGrid() { F.doPostBack('@Url.Action("lodeGrid")', { fields: F.ui.Grid1.fields }); } </script> }
asset_a2Controller.cs
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; using CodeFDemo.BP; namespace CodeFDemo.Controllers.sysApp { public class asset_a2Controller : Controller { // GET: sysA1 public ActionResult Index() { BLLasset_a2 bll = new BLLasset_a2(); ViewBag.griddata = bll.Getasset_a2MsByQuery(new Message.MsQuery()).ToArray(); return View(); } } }
OK,瀏覽下(本實例只做列表展示)
第二步 將標准文件改寫為模板文件
再看下代碼,其中Grid的Columns是列的循環,查詢條件也是列的循環,數據庫表格的列一循環就可以了
所以就有了兩個模板
@{ ViewBag.Title = "Index"; var F = Html.F(); } @section head { } @section body { @( F.Panel() .IsViewPort(true) .ShowBorder(false) .ShowHeader(false) .Layout(LayoutType.Region) .Items( //中間Panel 查詢和列表 F.Panel() //.IsViewPort(true) .BoxFlex(4) .Layout(LayoutType.VBox) .BodyPadding(0)//5 .BoxConfigChildMargin("0 0 0 0")//0 0 5 0 .ShowBorder(false) .ShowHeader(false) .Items( //查詢表單 F.Form() .ID("searchForm").Title("查詢條件") .BodyPadding(5).BoxConfigChildMargin("0 5 0 5").BoxFlex(1) .Layout(LayoutType.VBox) .BoxConfigAlign(BoxLayoutAlign.Stretch).BoxConfigPosition(BoxLayoutPosition.Center) .EnableCollapse(true) .LabelWidth(100) .RowsEx(4 $$TextBoxForSearch$$ ) , //列表 F.Grid() .Title("列表") .ID("Grid1") .BoxFlex(6) .EnableCheckBoxSelect(true) .DataIDField("$$KEY$$") .AllowPaging(true) .EnableHeaderMenu(false) .PageSize(15) .Toolbars( F.Toolbar().Items( F.DefaultGridBtn("Grid1") ) ) .Columns( F.RowNumberField(), F.RenderField() .HeaderText("ID") .Hidden(true) .DataField("$$KEY$$") $$GridColumns$$ ) .DataSource(ViewBag.griddata) //.Listener("rowclick", "OnGrid1RowClick") ) ) ) } @section script { <script> F.ready(function () { }) //列表行點擊事件 function OnGrid1RowClick(e, rowid) { F.doPostBack('@Url.Action("Grid1_RowClick")', { rowid: rowid, fields: F.ui.Grid1.fields }); } //列表新增 function Grid1new_Click() { F.ui.Grid1.showEdit();//新增 } //列表修改 得到列表選中項 getSelectedRows 注意DataIDField屬性 function Grid1edit_Click(g,rowid) { F.ui.Grid1.showEdit(true);//修改 } //刪除 刪除此方法自動回發Grid1Del_Click 方法 參數為 id fields function Grid1delete_Click(g,ids) { } //刷新列表 function lodeGrid() { F.doPostBack('@Url.Action("lodeGrid")', { fields: F.ui.Grid1.fields }); } </script> }
,F.TextBox() .ID("txt$$ColunName$$") .Attribute("data", "$$ColunName$$") .Label("$$ColunNotes$$") .EmptyText("$$ColunNotes$$")
using System; using System.Collections.Generic; using System.Linq; using System.Web; using System.Web.Mvc; using $$namespace$$.BP; namespace $$namespace$$.Controllers.sysApp { public class $$tablename$$Controller : Controller { // GET: sysA1 public ActionResult Index() { BLL$$tablename$$ bll = new BLL$$tablename$$(); ViewBag.griddata = bll.Get$$tablename$$MsByQuery(new Message.MsQuery()).ToArray(); return View(); } } }
其中$$namespace$$ $$tablename$$ $$KEY$$ $$ColunName$$ $$ColunNotes$$ 都是系統默認字典。
多了兩個自定義字典$$TextBoxForSearch$$和$$GridColumns$$,其中$$TextBoxForSearch$$單獨建了一個模板,為了讓大家看看接口實現的另一種寫法。
將保存好的模板放到模板目錄里



第三步 編寫模板翻譯類
新建模板擴展類,引用CodeFactoryMVC.Main.dll,列實現接口ICodeFactory


注意第43行:
生成CodeFEx.dll,考到bin文件夾下,在web上新增接口
OK完成,刷新頁面選擇其余表,填寫項目名稱,點擊生成,拷貝到原項目,隨便找個表預覽下
一個list頁面就做好了。CodeFDemo的項目源碼會放在 知識星球 提供下載,
沒有加入星球的趕緊加入(越來越貴!)