H p y系统自助终端面开发流程和规范版HEN system office room 【HEN16H-HENS2AHENS8Q8-HENH1688】终端页面开发流程和规范版版本历史Hipay系统自助终端页面开发流程和规范一：Hipay页面开发1 目录结构：：顶层目录结构图（1）所示Applications: 目录里放着我们创建的应用板块。
Framework: 里是Hipay系统应用，包含实体和服务板块Base: 里放着启动，容器和配置和组件加载等公共类。
Data: 是Hipay内建的数据库。
Logs: 是系统日志文件夹。
是启动文件。
图（1）：applications 目录图（2）所示Accounting : 帐务管理，支付信息，发票等。
Content : 内容管理，调查等。
Ecommerce : 电子商务应用。
Order : 订单管理。
Party ：人员组织管理Securityext : 安全管理拓展Product : 产品管理。
: 板块加载配置文件。
图（2）：ecommerce 目录图（3）所示Src : java源文件。
Config : 配置文件，主要是多语言的配置文件Data : 系统运行时需要导入的数据文件Script : Hipay 系统 mini-lang文件（简单Java方法）Templates : 模板页面Webapp : web 服务需要用到的页面和脚本Widget : 用xml描述的页面: 用ant工具编译src文件夹的源文件生成的classes文件和jar包放在build 中。
: 电子商务板块加载配置文件。
图（3）：webapp 目录Webapp 下有一个应用文件夹为 ecommerce ，其目录结构如图（4）所示:除了 WEB—INF 文件夹以外，其他的文件都是页面文件，页面文件都是以ftl为后缀的freemaker模板页面。
图（4）：WEB—INF 目录如图（5）所示Actions : 系统脚本文件夹，beanshell脚本：流程控制器：网站参数设置图（5）：actions 目录如图（6）其文件结构和图（4）中的ftl页面结构是对应的。
比如说显示购物车信息的页面放在图（4）cart文件夹中，则对应的脚本放在图（6）的cart文件夹中，这样做不是必需的，但是是规范的，易于维护的。
图（6）：widget 目录Widget是把ftl页面和bsh脚本组合起来供前端显示的工具。
它用xml语言和特定标签描述页面和页面，页面和脚本之间如何组合和定制。
是公共模板定制页面是购物车相关页面定制是产品，目录的显示的页面定制是有关调查，寻价和客户方面的页面定制是跟内容管理相关的页面定制是跟订单和支付相关的页面定制是公共模板加载的脚本图（7）其他板块的目录结构和ecommerce 是相似的。
2 开发内容：对widget组合页面要熟练掌握。
Web Widget是轻量级的Web应用程序，为使用者提供一键式的服务。
它通常被设计为具有特定的功能，如提供天气、股票、拍卖等的信息。
它与网页一样，使用标准的Web技术开发，如XHTML，CSS，javascript等。
从这方面看，Widget是脱离浏览器UI运行的网页。
beanshell脚本准备数据，freemaker页面显示数据，而widget 工具正是组合脚本和页面的，它规定了哪个脚本为哪个页面组织数据，即起到绑定脚本和页面的作用，同时也可以定义某些变量供页面使用，当然有些页面可以没有脚本，简单的来说，widge t就是用户请求页面，它把变量，标签和freemaker模板语言组合生成HTML页面，当用户请求时就发送给用户浏览器。
Widget用到的标签在framework / widget / dtd 里的xsd文件里，如图（8）图（8）在eclipse开发环境下，有代码预示的功能，如图（9）图（9）图（10）图（10）的<!-- 的内容是注释，从图中的注释清楚地介绍的用widget如何定制一个模板。
screenScreen标签对应的是前端请求的页面，页面的名称name属性是必须的。
Screen 下有一个唯一的 section ，section下包含 condition ，actions ，widgets和fail-widgets 标签。
condition如果 condition存在，并且condition是true 则页面显示widgets内容，否则显示fail-widgets。
如果 condition不存在，则fail-widgets标签也就没有必要。
以下是对 attrName 非空的判断：<condition><not><if-empty field-name="attrName"/></not></condition><if-has-permission permission="ORDER_VIEW"/>是检查当前用户是否拥有对order 的VIEW（查看）的权限<if-compare value="常量" field-name="变量" operator="操作"/> 是把变量跟某个常量进行比较，操作包括 less greater equals less-equals greater-equals not-equals contains ,分别表示，小于大于等于小于等于大于等于不等包含。
<if-compare-field field-name="变量1" operator="" to-field-name="变量2" type= "String" />是把两个变量进行比较, type类型值可以为Float Double Integer Long Boolean String PlainString Date Time Timestamp 和Object，如果没有type默认为String。
and 是对多个条件进行与操作 or 或操作 xor 异或 not 非<and>< 条件1 >< 条件2 ></and><or>< 条件1 >< 条件2 ></or>其他的标签请查看图（8）所示的文件中内容。
actionsactions 是加载页面之前的动作。
常用的动作是：set :set定义一个变量并赋值 field 的值就是变量名 value 是变量值；script加载一个beanshell脚本文件，location是脚本的位置，位置以”xyz/ ”开头，意思是在xyz这个板块下，xyz是在Hipay的安装目录下的applications和framework下的第一层子目录文件夹，如图（2）得文件夹都可以作为这里的xyz。
property-map :property-map加载一个属性文件，resource的值是文件的名称，文件后缀为properties,可省略不写，对于多语言，比如要加载简体中文配置文件和美国英语配置文件，并把配置文件的键值对放在一个Map即uiLabelMap中，作为全局变量是用，只需要这样一行代码：<property-map resource="TMSBaseUiLabels" map-name="uiLabelMap"global="true"/>这行代码会加载所有各种语言的配置文件，然后根据用户的locale，读取当时当地的语言配置。
还有一点需要注意，如果uiLabelMap在中找不到键值，它会去查找，如果没找到，则继续查找，如果仍然没有值则返回键本身，如果有则返回文件中定义的值；widgetsWidgets 是对页面的加载和布局。
常用的加载页面的方法包括1：platform-specific<platform-specific><html></html></platform-specific>为要加载的文件路径和名称。
即TMSBase这个板块下webapp文件夹的子文件夹TMSBase下的子文件夹includes下的文件。
2：include-screen<include-screen name="abc" location="idget/" />这行代码的意思是加载一个页面，这个页面是在TMSBase这个板块下的widget文件夹下的文件里定义的abc页面。
abc是screen的 name的值。
3：decorator另外，模板常用到这行代码 <decorator-section-include name="body"/> ，意思是页面的body部分是空的，其他页面使用以下代码使用这个模板，<decorator-screen name="main-decorator"> main-decorator是模板的名称（screen的name的值）则其他页面的内容出现在body部分。
4：containerWidget中可以加载容器 <container style="样式表"> 容器里面可以加载其他页面，这类似于HTML中的DIV 层。
以下代码是合法的：<container style=""><include-screen name=""></include-screen><platform-specific><html><html-template location=""/></html></platform-specific><decorator-section-include name="body"/></container><include-screen name=""></include-screen>和<include-screen name=""/>效果是等同的，其他类似。