修改需求:如下图所示(命名为表单列表页),在左侧为树状业务表单列表,右侧为数据明细列表页面中,增加直接操作MongoDB的具体业务管理配置功能(命名为Mongo列表页),也就是配置数据操作表单界面。
为了不影响已经上线的业务,并简化开发,设计思路是:
- 复制原表单列表页(命名为新表单列表页),在对树操作时,增加替换当前页为Mongo列表页,以及在Mongo列表页对树操作时,替换回原新表单列表页;
- Mongo列表页的数据列表,替换为可动态变化的列表,数据直接来自MongoDB。
接下来分析、修改代码:
1、查找、定位页面
如上图,把鼠标放置到“资费审批流程”上,将能找到界面URL。
http://10.64.50.153/home/HLJ/unicom/sunhall/my_desk/my_biz_info.html?INFO_ID=07d2ce21-f208-11e6-e1a4...
代码my_biz_info.html,将是定位修改的页面。
2、复制my_biz_info.html代码为my_biz_info_new.html,对应的JavaScript代码也复制并命名为my_biz_info_new.js
<script type="text/javascript" src="js/my_biz_info.js" charset="UTF-8"></script>
3、查询代码、定位修改点
(1). 定位构造树状结构代码
//树形菜单
$.cordys.utils.sendCordysAjax({
method: "GetFormdefByInfoid",
namespace: "http://unicom.com/workflow",
parameters: {
infoId:INFO_ID
}
}).done(function(rdate){
console.log(rdate);
var innerHtml = "";
var dateAry= rdate.tuple;
if(dateAry.length>1){
$.each(dateAry,function(index,ele){
console.log(index);
console.log(ele);
innerHtml += "<li>";
innerHtml += " <div class=\"header\">";
innerHtml += " <span class=\"label01\" style=\"background-image: url(../../home/icon/icon_s_01.png);\">";
innerHtml += " <a href=\"###\" onclick=\"javascript:appForm('" + dateAry[index].old.wkfl_formdef.FORMUID + "');\">" + dateAry[index].old.wkfl_formdef.FORM_NAME + "</a>";
innerHtml += " </span>";
innerHtml += " <span class=\"arrow up\"></span>";
innerHtml += " </div>";
innerHtml += "</li>";
});
(2). 根据“GetFormdefByInfoid”Webservice,确定Mongo列表的标识。
首先,查找Java代码,打开Eclipse工程,通过查询方法来查找代码。
注:Webservice对应的方法名称,首字母转换为小写。
接着,通过Java代码,确定了此Webservice是对表WKFL_FORMDEF操作,通过分析表结构和数上线据,发现原结构中的FORM_MONGO_ID是可以使用,如下图所示。
参考Java代码片段如下:
public static int getWkflFormByCond(int condition, int pageNumber, int pageSize) {
String sql = "SELECT COUNT(WKFL_FORMDEF.FORMUID) FORMDEF_NUM FROM WKFL_FORMDEF WHERE WKFL_FORMDEF.TENANT_DN = '11'";
QueryObject queryObject = new QueryObject(sql);
BusObject numBusObject = queryObject.getObject();
int formNum = numBusObject.getIntProperty("FORMDEF_NUM");
(3). 确定修改点
在构造树形列表代码中,“<a href=\"###\"
”为URL地址,替换为实际即可,但是需要判断语句进行切换。参考代码,可以使用Webservice返回值FORM_MONGO_ID。
4、确认判断条件
在Cordys开发平台上,使用工具Web Service Interface Explorer,查找到getWkflFormByCond。选中目标租户记录,鼠标邮件使用Operation Test Tool工具,测试此Webservice,如下图所示。
图中,“FORM_MONGO_ID”就是需要判断依据条件。
5、修改my_biz_info_new.js代码
增加判断代码,以及明确固化URL如下:
if (dateAry[index].old.wkfl_formdef.FORM_MONGO_ID!==null){
innerHtml += " <a href=\"my_biz_info.html\" onclick=\"javascript:appForm('" + dateAry[index].old.wkfl_formdef.FORMUID + "');\">" + dateAry[index].old.wkfl_formdef.FORM_NAME + "</a>";
}else{
innerHtml += " <a href=\"my_biz_info_new.html\" onclick=\"javascript:appForm('" + dateAry[index].old.wkfl_formdef.FORMUID + "');\">" + dateAry[index].old.wkfl_formdef.FORM_NAME + "</a>";
}
参考:
《WebService另类用法之一,运维》 肖永威 2016.01