Service Portal Header Menu: always show My Tickets, but hide My Surveys unless >0

JP-ODU · ‎01-23-2020

We were using the out of the box Service Portal>Widgets>Header Menu, which has two menu items: My Tickets and My Surveys and hides them unless >0. I was asked to always show My Tickets.

To do so, I did the following:

1. Go to Service Portal>Widgets>Header Menu
2. Clone Header Menu, name "Header Menu always show My Tickets"
3. Change the client controller script at line 41 to:

if (item.items || (item.scriptedItems && item.scriptedItems.count >= 0))

4. Go to sp_ng_template.list and change the Widget for menuTemplate, item-added-tooltip.html, and spDropdownTreeTemplate to "Header Menu always show My Tickets"

5. Update the code of menuTemplate to:

	<a role="menuitem" ng-if="item.items.length == 0 && !item.scriptedItems" ng-href="{{::item.href}}" ng-click="collapse()" target="{{::item.url_target}}" title="{{::item.hint}}">
	  <fa ng-if="::item.glyph" name="{{::item.glyph}}"></fa>
	  <span ng-bind-html="::item.label"></span>
	</a>
	<a role="menuitem" aria-haspopup="true"  ng-if="item.items.length > 0" href class="dropdown-toggle sp-menu-has-items" data-toggle="dropdown" aria-controls="{{::item.label.split(' ').join('')}}" aria-haspopup="true" title="{{::item.hint}}">
	  <fa ng-if="::item.glyph" name="{{::item.glyph}}"></fa>
	  <span ng-bind-html="::item.label"></span> <span class="caret"></span>
	</a>
	<ul ng-if="item.items.length > 0" class="dropdown-menu" role="group" id="{{::item.label.split(' ').join('')}}">
	  <li ng-repeat="item in item.items" ng-include="'menuTemplate'" />
	</ul>
	<a role="menuitem" aria-haspopup="true" ng-if="item.scriptedItems.count >= 0" href data-toggle="dropdown" aria-label="{{::item.label}} : {{item.scriptedItems.count}}" title="{{::item.hint}}">
	  <fa ng-if="::item.glyph" name="{{::item.glyph}}"></fa>
	  <span ng-bind-html="::item.label"></span>
	  <span ng-if="::!item.scriptedItems.omitBadge" class="label label-as-badge label-primary sp-navbar-badge-count">{{item.scriptedItems.count}}</span>
	</a>
<sp-dropdown-tree role="menu" aria-label="{{::item.label}}" ng-if="item.scriptedItems.count >= 0" items="item.scriptedItems.items" />

6. Go to Service Portal>Menus and open the Instance with Menu record titled "SP Header Menu" and set the widget as "Header Menu always show My Tickets"

Challenge: this means that My Tickets and My Surveys *both* always show up and I've been told that we really want to always see My Tickets, but only see My Surveys if >0... anyone know how I can update the above scripting to split the two? It seems to me that I need to call something other than item.scriptedItems? Or perhaps change a list that refers to somewhere?

amaradiswamy · ‎01-24-2020

@JP-ODU

Hi,

You may try below.

1.Navigate to Service Portal --> Portals and open your service portal record where you are displaying the menu.

2. Click on information icon placed next to "Main Menu" and click on "Open Record" button.

3. Now, scroll down to the related list "Menu Items", click on "New" button

Label: Incident List

Type: Scripted List

Condition: gs.isLoggedIn()

Server Script:

// maximum number of entries in this Menu
var max = 10;

var t = data; 
t.items = [];

var u = gs.getUser().getID();

// use record watchers to tell header when to update dropdown counts
t.record_watchers = [];
t.record_watchers.push({'table':'incident','filter':'active=true^caller_id=' + u});

var z = new GlideRecord('incident');
z.addActiveQuery();
z.addQuery('caller_id', gs.getUserID()).addOrCondition('opened_by',gs.getUserID());
z.orderByDesc('sys_updated_on');
z.setLimit(max);
z.query();
while (z.next()) {
  var a = {};
  $sp.getRecordValues(a, z, 'short_description,sys_id,number,sys_updated_on');
  if (z.short_description.nil())
    a.short_description = "(No description)";
  a.__table = z.getTableName();
  a.type = 'record';
  a.sortOrder = z.sys_updated_on.getGlideObject().getNumericValue();
  t.items.push(a);
}
var incCount = 0;
var incRec = new GlideAggregate('incident');
incRec.addQuery('caller_id', gs.getUserID()).addOrCondition('opened_by',gs.getUserID());
incRec.addActiveQuery();
incRec.addAggregate('COUNT');
incRec.query();
if(incRec.next())
{
incCount = incRec.getAggregate('COUNT');
}

t.items.sort(function(a, b) {
  return b.sortOrder - a.sortOrder;
});
t.items = t.items.slice(0, max); // only want first 30
t.count = incCount;
if(incCount == 0)
{
t.count = 'O';
}

var link = {title: gs.getMessage('View All Reported Issues'), type: 'link', href: '?id=list&table=incident', items: []};
t.items.unshift(link);

4. Submit or Save the record

View solution in original post

amaradiswamy · ‎01-23-2020

I am assuming that My Tickets and My Surveys are Scripted List type menu items. Then, without modifying header widget, you can do below

In script, check the count of records in GlideRecord query if count is less than 0 then you can put t.count= 'o' (this is an alphabet O, not 0 so system will considered that there is some value and display the menu item.

I know above is not a perfect solution and if we want to go with modifying OOTB widgets and okay to test for every major release upgrade then in template you can hard-code the menu sysid to allow display though count is not greater than 0.

JP-ODU · ‎01-24-2020

Ooh, that's a very interesting approach, I like it! But I'm too novice with script to seem to get it working. Is it possible you can share the query script you'd use, and also where I'd apply it? Do we mean as a Business Rule, a Catalog Client Script, something else? I can't immediately logic out where this would go...

Thanks for your help!

amaradiswamy · ‎01-24-2020