Hipay系统自助终端页面开发流程和规范06版Word格式.docx
- 文档编号:4320345
- 上传时间:2023-05-03
- 格式:DOCX
- 页数:31
- 大小:229.15KB
Hipay系统自助终端页面开发流程和规范06版Word格式.docx
《Hipay系统自助终端页面开发流程和规范06版Word格式.docx》由会员分享,可在线阅读,更多相关《Hipay系统自助终端页面开发流程和规范06版Word格式.docx(31页珍藏版)》请在冰点文库上搜索。
Content:
内容管理,调查等。
Ecommerce:
电子商务应用。
Order:
订单管理。
Party:
人员组织管理
Securityext:
安全管理拓展
Product:
产品管理。
Component-load.xml:
板块加载配置文件。
图
(2)
1.3:
ecommerce目录图(3)所示
Src:
java源文件。
Config:
配置文件,主要是多语言的配置文件
Data:
系统运行时需要导入的数据文件
Script:
Hipay系统mini-lang文件(简单Java方法)
Templates:
模板页面
Webapp:
web服务需要用到的页面和脚本
Widget:
用xml描述的页面
Build.xml:
用ant工具编译src文件夹的源文件生成的classes文件和jar包放在build中。
giantstone-component.xml:
电子商务板块加载配置文件。
图(3)
1.4:
webapp目录
Webapp下有一个应用文件夹为ecommerce,其目录结构如图(4)所示:
除了WEB—INF文件夹以外,其他的文件都是页面文件,页面文件都是以ftl为后缀的freemaker模板页面。
图(4)
1.5:
WEB—INF目录如图(5)所示
Actions:
系统脚本文件夹,beanshell脚本
controller.xml:
流程控制器
web.xml:
网站参数设置
图(5)
1.6:
actions目录如图(6)
其文件结构和图(4)中的ftl页面结构是对应的。
比如说显示购物车信息的页面showcart.ftl放在图(4)cart文件夹中,则对应的脚本showcart.bsh放在图(6)的cart文件夹中,这样做不是必需的,但是是规范的,易于维护的。
图(6)
1.7:
widget目录
Widget是把ftl页面和bsh脚本组合起来供前端显示的工具。
它用xml语言和特定标签描述页面和页面,页面和脚本之间如何组合和定制。
CommonScreens.xml是公共模板定制页面
CartScreen.xml是购物车相关页面定制
CatalogScreens.xml是产品,目录的显示的页面定制
CustomerScreens.xml是有关调查,寻价和客户方面的页面定制
ContentScreens.xml是跟内容管理相关的页面定制
OrderScreens.xml是跟订单和支付相关的页面定制
EcommerceSetup.bsh是公共模板加载的脚本
图(7)
其他板块的目录结构和ecommerce是相似的。
2开发内容
2.1:
对widget组合页面要熟练掌握。
WebWidget是轻量级的Web应用程序,为使用者提供一键式的服务。
它通常被设计为具有特定的功能,如提供天气、股票、拍卖等的信息。
它与网页一样,使用标准的Web技术开发,如XHTML,CSS,javascript等。
从这方面看,Widget是脱离浏览器UI运行的网页。
beanshell脚本准备数据,freemaker页面显示数据,而widget工具正是组合脚本和页面的,它规定了哪个脚本为哪个页面组织数据,即起到绑定脚本和页面的作用,同时也可以定义某些变量供页面使用,当然有些页面可以没有脚本,简单的来说,widget就是用户请求页面,它把变量,标签和freemaker模板语言组合生成HTML页面,当用户请求时就发送给用户浏览器。
Widget用到的标签在framework/widget/dtd里的xsd文件里,如图(8)
图(8)
在eclipse开发环境下,有代码预示的功能,如图(9)
图(9)
图(10)
图(10)的<
!
--的内容是注释,从图中的注释清楚地介绍的用widget如何定制一个模板。
screen
Screen标签对应的是前端请求的页面,页面的名称name属性是必须的。
section
Screen下有一个唯一的section,
section下包含condition,actions,widgets和fail-widgets标签。
condition
如果condition存在,并且condition是true则页面显示widgets内容,否则显示fail-widgets。
如果condition不存在,则fail-widgets标签也就没有必要。
以下是对attrName非空的判断:
<
condition>
<
not>
<
if-emptyfield-name="
attrName"
/>
/not>
/condition>
if-has-permissionpermission="
ORDER_VIEW"
是检查当前用户是否拥有对order的VIEW(查看)的权限
if-comparevalue="
常量"
field-name="
变量"
operator="
操作"
是把变量跟某个常量进行比较,操作包括lessgreaterequalsless-equalsgreater-equalsnot-equalscontains,分别表示,小于大于等于小于等于大于等于不等包含。
if-compare-fieldfield-name="
变量1"
"
to-field-name="
变量2"
type="
String"
/>
是把两个变量进行比较,type类型值可以为FloatDoubleIntegerLongBooleanStringPlainStringDateTimeTimestamp和Object,如果没有type默认为String。
and是对多个条件进行与操作or或操作xor异或not非
and>
条件1>
条件2>
/and>
or>
/or>
其他的标签请查看图(8)所示的文件中内容。
actions
actions是加载页面之前的动作。
常用的动作是:
set:
set定义一个变量并赋值field的值就是变量名value是变量值;
script:
script加载一个beanshell脚本文件,location是脚本的位置,
位置以”component:
//xyz/”开头,意思是在xyz这个板块下,xyz是在Hipay的安装目录下的applications和framework下的第一层子目录文件夹,如图
(2)得文件夹都可以作为这里的xyz。
property-map:
property-map加载一个属性文件,resource的值是文件的名称,文件后缀为properties,可省略不写,对于多语言,比如要加载简体中文配置文件TMSBaseUiLabels_zh_CN.properties和美国英语配置文件TMSBaseUiLabels_en_US.properties,并把配置文件的键值对放在一个Map即uiLabelMap中,作为全局变量是用,只需要这样一行代码:
property-mapresource="
TMSBaseUiLabels"
map-name="
uiLabelMap"
global="
true"
这行代码会加载所有各种语言的配置文件,然后根据用户的locale,读取当时当地的语言配置。
还有一点需要注意,如果uiLabelMap在TMSBaseUiLabels_zh_CN.properties中找不到键值,它会去TMSBaseUiLabels_zh.properties查找,如果没找到,则继续查找TMSBaseUiLabels.properties,如果仍然没有值则返回键本身,如果有则返回文件中定义的值;
widgets
Widgets是对页面的加载和布局。
常用的加载页面的方法包括
1:
platform-specific
platform-specific>
html>
html-templatelocation="
component:
//TMSBase/webapp/TMSBase/includes/header.ftl"
/html>
/platform-specific>
//TMSBase/webapp/TMSBase/includes/header.ftl为要加载的文件路径和名称。
即TMSBase这个板块下webapp文件夹的子文件夹TMSBase下的子文件夹includes下的header.ftl文件。
2:
include-screen
include-screenname="
abc"
location="
//TMSBase/widget/bcd.xml"
这行代码的意思是加载一个页面,这个页面是在TMSBase这个板块下的widget文件夹下的bcd.xml文件里定义的abc页面。
abc是screen的name的值。
3:
decorator
另外,模板常用到这行代码<
decorator-section-includename="
body"
,
意思是页面的body部分是空的,其他页面使用以下代码使用这个模板,
decorator-screenname="
main-decorator"
>
main-decorator是模板的名称(screen的name的值)
则其他页面的内容出现在body部分。
4:
container
Widget中可以加载容器<
containerstyle="
样式表"
容器里面可以加载其他页面,这类似于HTML中的DIV层。
以下代码是合法的:
/include-screen>
<
/container>
和<
效果是等同的,其他类似。
5:
widget中的section
widgets>
section>
……
/section>
/widgets>
widgets中可以放置多个section
6:
其他
加载一个图片可以使用<
imagesrc="
/image>
页面上显示一行文字可用<
labeltext="
/label>
fail-widgets
等同于widget标签,是条件不满足时给用户显示的页面。
2.2:
对freemaker模板语言的熟练掌握
2.2.1:
各页面功能及存放位置
页面文件后缀为ftl,存放在图(4)所示的目录中,即webapp下的应用文件夹中
自助终端目前用到的页面中有图(4)中的部分页面:
main.ftl是主页面,用户返回时会到此页面,该页面左边显示分类,右边显示推广产品。
mainframe.ftl框架页面分三个部分框架上面部分占99.98%是用户操作的业务页面,框架中间占0.01%,是用来加载终端插件,框架下部是用来加载加密插件和进行加密验证的。
mainup.ftl是语言选择页面。
login.ftl是用户刷卡登陆页面。
cart下的showcart.ftl页面(购物车页面)
catalog下的sidedeepcategory.ftl(终端屏幕的左边目录翻页页面)
customer下的survey.ftl(调查页面即用户的密码,号码输入页面)
error下的error.ftl(错误页面)
includes下的:
header.ftl模板头部导航栏加载样式表定制页面超时脚本
footer.ftl模板底部留个按钮
hidebottom.ftl加载终端插件,是页面底部框架固定不动的部分,对于不同的终端,申明和条用插件的方式可能不同,此时需要编写多个厂家的底部框架页面。
jiami.ftl工行自助终端用到的加密插件页面。
order下的
checkoutoptions.ftl该页面显示正在支付中,请用户等候,该页面向后台传递了用户的支付方式,货物的运送方式,联系方式等等重要信息,不可或缺。
ordercomplete.ftl该页面是支付完成页面,显示支付结果,成功则用户可以选择打印凭条。
另外还用到了order板块的webapp下ordermgr的字文件夹entry的catalog的部分文件,如图(11)
图(11)
calldetailIE.ftl是天一终端的IE浏览器在进行银行卡打电话业务时显示的页面。
calldetailNE.ftl是芙蓉终端mozzila浏览器银行卡打电话页面
category.ftl是显示产品分类的页面其指向categorydetail
categorydetail.ftl是产品分类的详细信息页面其指向productsummary.ftl
productsummary.ftl是某一个分类下所有产品的简要介绍页面,在终端上就是显示在屏幕右边的四个按钮上的内容。
product.ftl是产品页面其指向productdetail.ftl页面
productdetail.ftl页面是根据对产品的配置的详情页面来展示产品。
比如银行卡打电话这个产品就是配置成了calldetail.ftl,如果没有配置则默认显示productdetail.ftl页面
2.2.2:
常用的页面标签
以下例子中可以见到常用到了页面标签。
divclass="
ecom-body"
ladyFirstPosition"
imgsrc="
/images/motif_ty.gif"
/div>
textPosition"
${uiLabelMap.chooseLanguage}
#--
R1"
${uiLabelMap.firstPagedownInformation}
-->
#iflanguagesList?
has_content>
#listlanguagesListaslanguage>
#iflanguage?
#assignindex=4-languagesList?
size+language_index+1>
#assignstyleValue="
productcontent"
+index>
inputtype="
button"
id="
${styleValue}"
class="
buttonImgClass"
value="
${uiLabelMap[language.description?
if_exists]}"
name="
${index*2}"
onclick="
window.location='
@giantstoneUrl>
${language.requestUri?
if_exists}<
/@giantstoneUrl>
'
;
/#if>
/#list>
2.2.2.1注释<
#---->
注释的内容不能出现--字样
要注意区分HTML页面的注释<
---->
2.2.2.2赋值assign
设置变量<
#assignindex=5>
页面使用变量时用${index},将会显示5
2.2.2.3条件判断ifelse
使用时以尖括号和#开头<
#ifboolean>
并以<
结尾
#if(a>
b)>
A比B大
#else>
A不比B大
2.2.2.4列表listsizeindex
#assignlanguagesList={Chinese,English,French}>
languagesListsize=${languagesList?
size}
${language}位置是${language_index},
则最后显示的结果是:
Chinese位置是0,English位置是1,French位置是2,
2.2.2.5异常处理
如果变量值没有定义页面就会报错,加上以下一些判断,可以消除页面上的错误:
existsif_existshas_contentdefault
exists是对某个变量进行判断,返回值是布尔型trueorfalse;
if_exists返回是字符串,对某个变量进行判断如果值或引用不存在则显示空串,相当于“”;
has_content对变量进行判断,如果值或引用存在并且不为空时才为true否则为false。
default如果变量无值就设定默认值。
#ifsomeparameter?
exist>
${someparameter}
has_content>
${someparameter?
if_exists}
default(“defaultValue”)}
2.2.2.6其他
对于自助终端页面目前常用就是上面介绍的这些标签
更多请参考FreeMarker设计指南.doc
推荐登陆官方网站www.freemaker.org查看详细手册。
2.3:
对beanshell脚本的熟悉
Beanshell是宽松的Java,使用变量前无需定义,它完全兼容Java语法。
详情请登陆官方网站www.beanshell.org
Flt页面负责显示后台传来的数据,对页面来说beanshell脚本是重要的后端数据源,
在beanshell里可以直接引用request变量和context变量;
通过request的getParameter(“name”)方法bsh脚本可以获取前端页面传来的参数
通过context的put(“name”,value)方法bsh脚本可以把经过处理的数据送回前端页面显示。
页面使用${name}即可显示。
request可以得到delegator和dispatcher
delegator
bsh脚本中得到delegator:
delegator=request.getAttribute("
delegator"
);
delegator是实体引擎对数据库增删查改的代理器;
数据库查找
根据主键查找:
Bsh脚本中最常做的事情是到数据库中查找数据供前台页面展示。
value=delegator.findByPrimaryKey("
数据库表名"
inMap);
inMap放置主键键值对.UtilMisc.toMap("
name"
"
value"
)方法是把键值对放入Map中
比如:
orderHeader=delegator.findByPrimaryKey("
OrderHeader"
UtilMisc.toMap("
orderId"
"
1000"
));
意思是在表OrderHeader中查找主键(orderId)等于1000的记录,查出后赋给orderHeader。
根据某几个字段交集查询:
valueList=delegator.findByAnd("
orderHeader=delegator.findByAnd("
UtilMisc.toMap("
statusId"
APPROVE"
,"
grandTotal"
200"
意思是在表OrderHeader查询状态是APPROVE并且交易金额是200元的记录列表。
根据某几个字段并集查询:
valueList=delegator.findByOr("
orderHeader=delegator.findByOr("
意思是在表OrderHeader查询状态是APPROVE或者交易金额是200元的记录列表。
根据条件查询:
delegator.findByCondition(数据库名,条件列表,需要查询出来的字段列表,字段排序列表)
需要查询出来的字段列表如果设置为null则默认查出所有字段。
创建条件
比如产品号等于10001:
Condition1=newEntityExpr("
productId"
EntityOperator.EQUALS,"
10001"
状态是ACTIVE:
Condition2=newEntityExpr("
statusId"
ACTIVE"
生产日期大于某个日期date1:
Condition3=newEntityEx
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- Hipay 系统 自助 终端 页面 开发 流程 规范 06