Create Your Own Health Cloud Empower Components

Use these examples to help you create custom Health Care Empower components.
Create a component that works with the care plan selector

You can create a component to display custom objects or information for a care plan or for a patient or member. For example:

  • For a custom object, display the related list of records for the care plan.
  • Display a list of the EHR records for the person, such as medications or visits.
  • Display the list of care plan problems or goals.
  • Display a graph of medical device measurements or lab results.
  • Display details of the care plan.

The custom components are used with the Empower care plan selector, so you must handle the HcCommunityEventCarePlanSelected event.

For example:

.cmp file

1<aura:component implements="forceCommunity:availableForAllPageTypes" access="global"
2        >
3      <!-- attributes here -->
4
5   <aura:handler event="HcCommunityEventCarePlanSelected" action="{!c.onCarePlanChange}"/>
6
7      <!-- display data here -->	
8
9</aura:component>

controller.js file

1({
2	onCarePlanChange : function(component, event, helper) {
3        var carePlanId = event.getParam("carePlanId");
4        var patientId = event.getParam("patientId");
5        // do some action here to update the data/layout of the component
6	}
7})
Create a custom component that replaces the care plan selector
You can create a substitute component for the care plan selector. For example, the custom component could have a select list that displays different information or behaves differently than the one included in the package. Or you could add a text search box to find a name or medical record number.

The component must fire the HcCommunityEventCarePlanSelected event trigger.

.cmp file

1<aura:component implements="forceCommunity:availableForAllPageTypes" access="global" >
2        <!-- attributes here --> 
3   <aura:registerEvent name="carePlanChange" type="c:HcCommunityEventCarePlanSelected"/>
4        <!-- display data here --> 
5</aura:component>

controller.js file

1({ 
2       onSomeActionInTheComponent : function(component, event, helper) { 
3          var carePlanId = [get from component];
4          // OR 
5          var patientid = [get from component]; 
6          var carePlanEvent = 
7             $A.get("e.HcCommunityEventCarePlanSelected"); 
8             carePlanEvent.setParams({ 
9                'carePlanId': carePlanId, 
10                'patientId': patientId 
11             }).fire(); 
12       } 
13})