文章管理涉及T_Category 、T_Content 、T_Tag 和T_TagInContent 这4个表，在客户端，由于标签的两个表的显示会合并到文章内容里，因而文章管理至少需要2个模型和2个Store，一个是分类的，一个是Content的。
现在的问题是，文章管理界面左边的分类是以树形式显示的，是否需要用到一个完整的模型？完整的模型肯定是需要的，因为分类也要编辑、修改和新增。但树是否直接使用这个完整模型呢？这是要考虑的。首先，树的模型结构与完整模型肯定有区别，它会自动添加不少字段，而且id和text是必须的，这个在定义模型或Store时虽然可以改变，但不是很方便。其次，每次树节点展开，都要返回完整的模型数据，这对通讯来说有点浪费，因为这时候并不需要完整的模型数据，只有编辑节点的时候才需要。综合以上两点，笔者的观点是，还是拆分成两个模型比较合适，尽管返回完整模型有其优点，就是在编辑模型的时候，不用再去服务器取一次数据。
在编辑文章的时候，要通过Combobox选择文章分类，因而这里还需要一个模型和Store，这里要考虑的是使用下拉树选择框还是普通的下拉选择框。如果使用下拉树选择框，可以直接使用树列表的Store，使用树列表的唯一问题是在编辑文章的时候，如果当前树还没展开，会显示为空，因而在打开编辑窗口之前，一定要先展开树，处理起来有点复杂。第二种方式是下拉选择框，一次返回所有节点，或者使用类似搜索网站的查询方式显示结果。笔者比较倾向返回所有节点，在本地实现查询方式，因而，这里还需要一个模型和Store。
那么，文章是否也要拆分为2个模型和Store呢？这个主要考虑的就是通讯问题了。笔者的习惯做法是不拆，就用一个，理由嘛，习惯吧。
综合以上，需要建的模型包括Category、CategoryTree、CategoryCombo和Content这4个，Store则包括CategoriesTree、CategoriesCombo和Contents这3个。这里，少了一个分类的Store，是因为完整的分类模型只有在编辑、新增的时候用到，而这些都是单个模型实例的操作，不需要使用到Store，因而可以不定义。
目前明确后，就可以动手了。在Scripts\app\model目录下，先创建Category.js来定义完整的分类模型，代码如下：
Ext.define('SimpleCMS.model.Category',{
extend: 'Ext.data.Model',
fields: [
{name: "ParentId", type: "int", defaultValue: "-1"},
{ name: "CategoryId", type:"int" },
"Title",
"Image",
"Summary",
"Content",
{name: "Created", type: "date", dateFormat: "Y-m-dH:i:s", defaultValue: new Date() },
{ name: "SortOrder", type:"int", defaultValue: 0 }
],
proxy: {
type: "ajax",
url: "Category/Details",
reader: {
type: 'json',
root: "data",
messageProperty: "Msg"
}
},
idProperty: "CategoryId"
});
从定义代码可以看到，字段名与表格定义的字段名是一样的，这样的好处是方便。如果害怕信息泄露，可根据需要自己修改。有些字段没有定义是因为，在编辑过程中不需要显示这些字段，就省略了。代理的定义与之前的定义基本雷同，目的是保证使用统一的数据返回格式。
接着创建CategoryTree.js文件来定义分类树模型，代码如下：
Ext.define('SimpleCMS.model.CategoryTree',{
extend: 'Ext.data.Model',
fields: ["text",
{ name: "id", type:"int" },
{ name: "parentId", type:"int" }
]
});
代码里没定义代理，这个将由Store进行定义，因为基本操作是在Store层面。
接着是CategoryCombo.js，代码如下：
Ext.define('SimpleCMS.model.CategoryCombo',{
extend: 'Ext.data.Model',
fields: ["text",
{ name: "id", type:"int" },
{ name: "parentId", type:"int" },
"listText",
"fullpath",
{ name: "Hierarchylevel",type: "int" }
]
});
该模型实际只需要2个字段，不过为了显示上的需要，特意添加了另外几个字段。
接着是Content.js，代码如下：
Ext.define('SimpleCMS.model.Content',{
extend: 'Ext.data.Model',
fields: [
{name: "ContentId", type: "int" },
{ name: "CategoryId", type:"int", defaultValue: 10000 },
"Title",
"Image",
"Summary",
"Content",
{name: "Created", type: "date", dateFormat: "Y-m-dH:i:s", defaultValue: new Date() },
{ name: "Hits", type:"int" },
{ name: "SortOrder", type:"int", defaultValue: 0 },
"Tags"
],
proxy: {
type: "ajax",
url: "Content/Details",
reader: {
type: 'json',
root: "data",
messageProperty: "Msg"
}
},
idProperty: "ContentId"
});
代码中添加了一个Tags字段，用来显示标签，该字段将以数组形式返回数据，这样，在后续的处理中会很方便。在CategoryId中，它的默认值为10000，表示文章创建时，默认的分类为“未分类”。
这样，模型就全部定义完了，现在切换到Store目录，先创建CategoriesTree.js，代码如下：
Ext.define("SimpleCMS.store.CategoriesTree",{
extend: 'Ext.data.TreeStore',
batchActions: false,
remoteFilter: false,
remoteSort: false,
model:"SimpleCMS.model.CategoryTree",
root: { text: "文章分类", id: -1 },
proxy: {
api: {
destroy: 'Category/Delete'
},
type: "ajax",
url: "/Category/List",
reader: {
type: 'json',
root: "data",
messageProperty: "Msg"
},
writer: {
type: "json",
encode: true,
root: "data",
allowSingle: true
}
}
})
因为分类的新增和编辑都是通过表单形式完成的，因而在配置项api中只定义了删除地址。
接着是CategoriesCombo.js，代码如下：
Ext.define("SimpleCMS.store.CategoriesCombo",{
extend: 'Ext.data.Store',
batchActions: false,
remoteFilter: false,
remoteSort: false,
autoLoad: true,
model:"SimpleCMS.model.CategoryCombo",
proxy: {
type: "ajax",
url: "/Category/All",
reader: {
type: 'json',
root: "data",
messageProperty: "Msg"
}
}
});
代码中定义了配置项autoLoad为true，说明在Store实例化后会自动加载数据。
最后是Contents.js，代码如下：
Ext.define("SimpleCMS.store.Contents",{
extend: 'Ext.data.Store',
model: 'SimpleCMS.model.Content',
batchActions: false,
remoteFilter: true,
remoteSort: true,
pageSize: 50,
proxy: {
type: "ajax",
url: "Content/List",
reader: {
type: 'json',
root: "data",
messageProperty: "Msg"
}
}
})
从代码可以看到，文章的Store需要支持远程排序和搜索，而且每50条记录为一页。
至此，文章管理的模型和Store就定义完了，下面要开始定义控制器了，这个下文再说。