```
interface IRazorPageSet {
saveApi: string, //保存的时候使用的action名称,默认为put
title: string,
}
class RazorPage
/*
title:页面标题文字,新增的时候会显示新增+title ,编辑的时候显示 编辑+ title 查看则是查看+title
api :页面默认需要使用的controller的名字,我们一般使用@(this.ApiName)来声明,避免拼写错误
idName:当前页面操作的实体默认的主键字段名,我们一般用@(this.IdName)来声明,避免拼写错误
*/
constructor(title: string, api: string, idName: string, set: IRazorPageSet)
```
这是后台增删改查页面的主要插件,用来管理列表和详情页的切换,并实现一些通用的业务逻辑。
插件以$.SailConfig.PageContent中定义的class为页面根节点,并设置为RazorPage.content属性,
很多事件都定义在这个节点上。并且在content中找寻.toolbar class 把#toolbar的内容 放到.toolbar
中。
插件定义了如下结构
* #divList
* #btnAdd
* .toolbar
* #toolbar
* #divDetail (对应RazorPage.$form)
* .form-body
* (js生成) #divViewer (对应RazorPage.$Viewer)
* (js生成) #divEditor (对应RazorPage.$Editor)
目前我们定义页面上最多只能有一个RazorPage插件,在插件声明初始化后,会触发body的事件
[pageInit.after],并把RazorPage实例作为参数传递过去,同时有个全局变量,Sail.RazorPage.Default会保存这个实例的对象。
插件初始化的时候是列表状态。插件的几种状态如下:
√表示显示
×表示隐藏
| 状态 | #divList | #divDetail | #divViewer | #divEditor |
| --- | --- | --- | ---| ---| ----|
|列表| √ | × | × | × |
|新增| × | √ | × | √ |
|编辑| × | √ | × | √ |
|查看| × | √| √ | × |
其中$Viewer和$Editor的内容分别由 [#viewTmpl] 和 [#modalTmpl]的模板内容决定。
$Viewer 模板中如果定义了 .btnToEdit 会实现从查看页面跳转倒编辑页面的功能
$Editor 模板中如果定义了 .btnToView 会实现从编辑页面跳转倒查看页面的功能
如果#divList中含有#btnAdd, 则点击后会切换到新增状态,对#divEditor执行ResetForm 并会触发after.Add事件。
一些方法:
* SetTitle(title:string) 设置页面标题文字
* SetFormTitle(title:string) 设置表单上的标题文字
* GetApi(name:string) 获取api的url
* GetDataId(obj: Object) 根据定义的IdName获取传入对象的主键值
* Cancel() 取消详情页,从新增、编辑、查看等状态切换到列表状态,同时触发after.Cancel事件
* ToEdit() 根据当前选择对象的内容切换到编辑页面,并触发after.Edit事件
* ToView() 根据当前选择对象的内容切换到查看页面,并触发after.View事件
* Add() 切换到新增页面,并触发after.Add事件
* EditAct(data: Object, page: Pagination, obj: JQuery) 触发编辑事件,参数依次是实体对象、分页插件、触发事件的jquery对象
* ViewAct(data: Object, page: Pagination, obj: JQuery) 触发查看事件,参数依次是实体对象、分页插件、触发事件的jquery对象
* Save(btn: JQuery) 保存事件,保存前会触发PreSave函数,如果定义了则会在PreSave函数之中对数据进行修改,保存成功会触发after.Save事件
* CreatePage(param: Sail.IPaginationSetting) 创建关联的分页插件,用于列表事件的显示,具体使用参考表格插件,默认 getPostKey() 为 { return $("#toolbar").GetJson(); } ,HandleName为tool.GetApi("getlist"),并且会注册如下事件:
* .btnView 触发查看
* .btnEdit 触发编辑
* .btnRemove 触发删除
* .btnAct 触发ajax post事件,action是data-act定义的,参数为当前实体的主键值
* PreSave(form:jquery,model:object) 这个方法需要重写,用来验证提交的model正确性或重新组织数据。最后必须返回一个对象,否则会阻止触发保存事件。传入的参数分别是#divEditor和获得的Json对象实例