创建定制仪表板

要显示您感兴趣的业务信息,您可以创建定制仪表板。

关于此任务

您可以通过创建人员服务,稍后将此服务显示为仪表板,来将定制仪表板添加至 Process Portal。人员服务可位于任何流程应用程序中。通过使用仪表板,用户可以查看与业务流程相关的业务数据。然后,用户可以使用仪表板来响应该业务数据或者其他项目(例如,消息)。

过程

  1. 添加对仪表板工具箱以及包含仪表板所使用的资源的其他工具箱的依赖关系。 要了解更多信息,请参阅在 Designer 视图中创建、更改和删除工具包依赖关系。仪表板工具箱包含 Coach 视图以及您可用来创建仪表板的其他资源。
  2. 创建用户通过仪表板进行监控和交互的人员服务。 要了解更多信息,请参阅构建遗留人员服务
  3. 在人员服务的“概述”页面中,将显示给字段设置为其成员可查看和使用仪表板的团队。将显示为字段设置为仪表板 要了解更多信息,请参阅公开遗留人员服务
  4. 可选: 针对仪表板名称设置 Process Portal 显示的标签。 如果您未设置该标签,那么 Process Portal 会使用人员服务的名称作为该标签。 要了解更多信息,请参阅使仪表板名称全球化
  5. 使用一个或多个 Coach 为仪表板创建用户界面。 要了解更多信息,请参阅构建 Coach。通常,Coach 包含多个 Coach 视图之一。这些 Coach 视图可以是库存控件、仪表板工具箱中的控件或定制 Coach 视图。有关创建 Coach 视图的信息,请参阅开发可复用的 Coach 视图
    提示: Process Portal 具有一种控件,可供您用于在当前页面的内容区域的左上角将当前页面设置为起始页。
    显示将当前页面设置为起始页的控件的截屏
    当为 Coach 设计布局时,请确保为此控件作出一些位置补偿。例如,移动 Coach 视图以防控件使用 CSS 规则来创建页边距或添加边距而与其重叠。
  6. 在您的定制仪表板中,如果您希望仪表板工具箱中的控件浏览至您的定制仪表板内,请创建定制的“导航控制器”。将定制的“导航控制器”添加到您的定制仪表板中。
    提示: 某些控件要求可以在仪表板中使用“导航控制器”控件。有关信息,请参阅仪表板工具包中的控件中个别控件的文档。
    要创建定制的“导航控制器”,请完成以下步骤:
    1. 将仪表板工具箱内的“导航控制器”复制到您的流程应用程序中,或者复制到与您的流程应用程序具有依赖关系的工具箱中。
    2. 打开副本的“行为”页面,并选择 load 事件处理程序。
    3. 编辑 topic.subscribe 回调函数,使其为目标仪表板构建正确的 URL。您可以通过使用 utilities.generateCustomDashboardURL = function(/*string*/type, /*string*/appName, /*string*/serviceName, /*object*/params, /*string, optional*/ snapshotName) 来完成此目标。 例如,
      var urlType = null;
      if ((!!(window.parent)) &&(window != window.parent)) { 
      	// In Process Portal 
      	urlType = utilities.constants.PORTAL_DASHBOARD_URL_TYPE; 
      } else {
      	// Not in Process Portal
      	urlType = utilities.constants.SERVICE_URL_TYPE; 
      }
      var targetLocation = utilities.generateCustomDashboardURL(urlType, "MyApp", MyHumanService", params)
      console.log(targetLocation);
      params 可从已发布的事件构建。其格式如下:
      params = {
      	"tw.local.param01":"data"
      	"tw.local.param02":"data2"
      }
      针对导航创建的 URL 因用户查看仪表板的位置不同而不同:
      • 如果用户在 Process Portal 内查看仪表板,那么 URL 的格式为:/dashboards/{PROCESS_APP_NAME}/{HUMAN_SERVICE_NAME},后接传递至仪表板的人员服务的其他参数。 例如,要传递流程应用程序标识,URL 为:/dashboards/{PROCESS_APP_NAME}/{HUMAN_SERVICE_NAME}?tw.local.processAppId=myProcessID
      • 如果用户在 Process Designer 或在定制门户网站中查看仪表板,URL 的格式为:/teamworks/executeServiceByName?processApp={PROCESS_APP_NAME}&serviceName={HUMAN_SERVICE_NAME},后接传递至仪表板的人员服务的其他参数。
  7. 在需要执行仪表板导航的任何定制 Coach 视图中,将事件发布至“导航控制器”预订的主题。 回调函数会为事件构建有效内容。 例如,仪表板工具箱中的流程摘要 Coach 视图具有以下回调:
    this.doNavigationCallback = function _doNavigationCallback_ProcessSummary(evt){
    	try{
    		var data = (!! this.context.binding) ?  this.context.binding.get("value") : null;
    		if(data!=null && typeof(data.processId)!="undefined" && data.processId!=""){
    			var params = {};
    			params[dutils.constants.DASHBOARD_NAVIGATION_SOURCE] = "ProcessSummary";
    			params[dutils.constants.DASHBOARD_NAVIGATION_DESTINATION] = dutils.constants.PROCESS_PERFORMANCE_SERVICE;
    			params[dutils.constants.PROCESS_ID_PARAMETER] = data.processId;
    			topic.publish(dutils.constants.DASHBOARD_NAVIGATION_TOPIC, params);
    		}
    	} catch (e) {
    		console.error(e);
    	}
    };
    在此情况下,有效内容为:
    "sourceControl":"ProcessSummary", 
    "destinationService":"Process+Performance",
    "tw.local.processAppId":"myProcessID"

    有关更多示例,请参阅仪表板工具箱中的“导航控制器”和“Coach 视图”。