How to add columns to a list view from widget with embedded report in Customer Service Portal

Anushiya Preeth
Tera Contributor

Hi,

We have a widget with embedded report in Customer service portal. When a user (customer) clicks on this widget, it opens into a list view to display the underlying data eg: 'My Open Cases'. There are only few columns that gets displayed on this list view currently and we want to add few more columns. Can someone please assist me in fulfilling this ask.

1 REPLY 1

Vishal Jaswal
Giga Sage

Hello @Anushiya Preeth 

In Service Portal Widgets list view, personalized list to include Body HTML template to search for "My Open Cases". If you are able to find the widget then you can update the widget as shown below:

Body HTML template:

 

<div class="panel panel-default" ng-if="data.isLoggedIn">
<div class="panel-heading">
<span class="panel-title">My Open Cases</span>
  <a href="{{data.allCasesUrl}}" class="view-all-link">View all</a>
  </div>
  <div style="overflow-x:auto;">
  <table class="table table-hover table-bordered table-striped table-responsive">
    <thead>
      <tr class="heading-color">
   			<th>Case Number</th> 
        <th>Case Status</th>
        <th>Short Decription</th>
        <th>Decription</th>
        <th>Created Date</th>
        <th>Last Updated Date</th>
        <th>Priority</th>
        <th>Assignment Group</th>
        <th>Configuration Item</th>
      </tr>
    </thead>
    <tbody>
       <tr class="body-color">
      <tr ng-repeat="x in data.array | startFrom:currentPage*pageSize | limitTo:pageSize " >
        <td><a href="?id=case_ticket&table=sn_customerservice_case&sys_id={{x.sys_id}}&view=csp">{{x.number}}</a></td>
        <td>{{x.state}}</td>
        <td>{{x.sd}}</td>
        <td>{{x.description}}</td>
        <td>{{x.openedAt}}</td>
        <td>{{x.updated}}</td>
         <td>{{x.priority}}</td>
        <td>{{x.assignmentGroup}}</td>
        <td>{{x.configurationItem}}</td>
      </tr>
      <tr ng-if="data.array.length == 0 ">
        <td colspan="4">No Cases to display</td>
      </tr>
      </tbody>
    </table>
  </div>
<div ng-if="data.num_pages > 1" class="panel-footer paginations ">
    <button ng-disabled="currentPage == 0" ng-click="numClick(currentPage-1)"class="btn btn-default"><i class="fa fa-chevron-left"></i></button>
    <div  class="btn-group">
      <a ng-repeat="i in getNumberFilter(data.num_pages) track by $index"
         href="javascript&colon;void(0)"
         ng-class="{ active: ($index) === currentPage }"
         ng-click="numClick($index)"
         type="button"
         class="btn btn-default"
         aria-label="Page {{$index + 1}}"
         ng-show="($index >= currentPage - 2 && $index <= currentPage + 2) || $index === 0 || $index === c.data.num_pages-1">{{$index+1}}
      </a>
    </div>
    <button ng-disabled="currentPage >= data.num_pages -1" ng-click="numClick(currentPage+1)"class="btn btn-default btn1"><i class="fa fa-chevron-right"></i></button>
  </div>
</div> 

 


Server Script:

 

(function() {
    /* populate the 'data' object */
    data.isLoggedIn = gs.isLoggedIn();
    data.userID = gs.getUserID();
    data.pageSize = 10; // for pagination
 

    if (data.isLoggedIn) {
            var grCase = new GlideRecord('sn_customerservice_case');
            grCase.addQuery('state', 'IN', '1,10,18');
            grCase.addQuery('opened_by', data.userID);
        
            grCase.orderByDesc('sys_updated_on');
            grCase.query();
            data.array = [];
            while (grCase.next()) {
                var outObj = {};
                outObj.sys_id = grCase.getValue('sys_id');
                outObj.number = grCase.getValue('number');
                outObj.state = grCase.getDisplayValue('state');
                outObj.sd = grCase.getValue('short_description');
                outObj.description = grCase.getDisplayValue('description');
                outObj.openedAt = grCase.getDisplayValue('sys_created_on');
                outObj.updated = grCase.getDisplayValue('sys_updated_on');
                outObj.priority = grCase.getDisplayValue('priority');
                outObj.assignmentGroup = grCase.getDisplayValue('assignment_group');
                outObj.configurationItem = grCase.getDisplayValue('cmdb_ci');
                data.array.push(outObj);
            }
            data.num_pages = Math.ceil(data.array.length / data.pageSize);  // display 10 cases per page
   
        data.allCasesUrl = "?id=all_cases_type_common_list&table=sn_customerservice_case&view=customer_view&spa=1&filter=opened_by=" + data.userID + "^company=" + data.companyID + "^stateIN1,10,18&p=1&o=sys_updated_on&d=desc&name=myactivecases";
	}	
})();

 


Hope that helps!