Ext制作的统计和任务跟踪系统

Ext制作的统计和任务跟踪系统

  
  第1个示例Pay是我们family168所做的例子中我最喜欢的一个，这是一个简易的信息统计查询工具，它甚至没有服务器端的代码，完全依靠JavaScript提供各种数据，在这个小系统中我们可以分类查看不同客户的信息，以及由这这些信息汇总的图形报表。
  其中包月包年的用户情况的统计使用的是maven2中的cobertura里的效果，这样哪些vip已经过期，哪些vip快到期就一目了然，当然最重要的是视觉效果好。
  首页效果如下图所示：

系统的最后一项功能是统计报表，我们可以按照用户类型和是否过期生成两种统计报表，报表图形并不是使用Ext JS实现的，而是用svg画的，不过我们在显示报表页面的时候使用了iframe，这样做的好处是不用将所有代码都加载到首页中，虽然RIA宣扬one page one application，但是使用iframe可以在一定程度上避免一次加载过多的资源文件，在实际中依然拥有适用的场景。
    显示效果如下图所示：

第2个示例Tracker是一个简易的任务跟踪系统，它使用了最基本的ssh开发框架，通过嵌入式数据库hsqldb保存数据，依靠maven2管理项目流程。俨然已经是一个小而全的企业系统了。
Ext JS在系统中负责前台展示的部分，后台通过struts2结合json-lib与前台的Ext JS进行交互，在开发过程中，我们封装了JsonGrid和JsonTree这些基本组件，很大程度上减少了编码的数量，提高的开发效率。
  系统界面如下：

  系统左侧是以JsonTree为基础生成的树形菜单，显示了所有工程的信息，我们可以直接在左侧面板部分进行添加，修改，删除等操作。
进行详细配置和右键功能菜单效果如下图所示：


统计系统下载： http://www.family168.com/demo/pay.rar
任务追踪系统下载： http://www.family168.com/demo/tracker.rar
由于第2个示例是使用maven2构建的，所以不会使用maven2的朋友可以查看我们的maven2教程 http://family168.com/oa/maven2/html/index.html。如果想知道这2个示例的详细讲解，可以上我们的论坛 http://family168.com/bbsindex.asp?boardid=13查看。

欢迎大家访问我的个人网站 萌萌的IT人