web控件使用--多页签(tab)

栏目：eas cloud知识作者：金蝶来源：金蝶云社区发布：2024-09-22浏览：1

web控件使用--多页签(tab)

简介：可分页签展示不同内容，如标准产品的报销工作台

https://waf2.kingdee.com:6999/waf2help/webviews/webframework/ctrls/tab/readme

关键词：多页签、页签容器、表格设置过滤条件

示例1：分页签显示待办任务、已办任务

1、添加多页签容器及相关控件

2、设置onSelect事件或onShow事件

3、编写代码

脚本：

 //切换页签
onSelectTab:function(event,ui){
          var index=ui.index;
          if(index==0){//待办任务
                 //设置过滤条件
                 var filter = waf.parseSql.getFilter("title","like","%4342%");
                 waf("#grid_waitingTask").wafGrid("option","filterItems",filter);
                 
                 waf("#grid_waitingTask").wafGrid("reloadGrid");
          }else if(index==1){//已办任务
                  var filter = waf.parseSql.getFilter("title","like","%00%");                 
                  waf("#grid_completedTask").wafGrid("option","filterItems",filter);
                  
          	  waf("#grid_completedTask").wafGrid("reloadGrid");
          }
}

4、后台过滤

如需要在后台过滤，可参考如下

4.1 扩展listData方法

4.2 后台实现过滤

脚本：

@Override
public void onRequest(WebListDataEvent event) throws WafException,
	BOSException {
	HttpServletRequest request = event.getReqeustContext()
				.getHttpServletRequest();
	ModelMap modelMap = event.getReqeustContext().get(ModelMap.class);
	EntityViewInfo entityViewInfo = (EntityViewInfo) modelMap
				.get("DataGridEntityView");
	if (entityViewInfo == null) {
		entityViewInfo = new EntityViewInfo();
	}

	if (request.getParameter("componentID") != null) {
		FilterInfo filter = new FilterInfo();
		/** 组件id */
		String componentID = request.getParameter("componentID");
		/** 根据组件id分别过滤 */
		if (componentID.equals("grid_waitingTask")) {// 待办任务
			filter.getFilterItems().add(
						new FilterItemInfo("sender", "李文斌", CompareType.LIKE));
		} else if (componentID.equals("grid_completedTask")) {// 已办任务
			filter.getFilterItems().add(
						new FilterItemInfo("MultiApprove.isPass", "true", CompareType.EQUALS));
		}

		if (FilterUtility.hasFilterItem(entityViewInfo.getFilter())) {
			entityViewInfo.getFilter().mergeFilter(filter, "AND");
		} else {
			entityViewInfo.setFilter(filter);
		}

		modelMap.put("DataGridEntityView", entityViewInfo);
	}
}

效果：