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

JP-ODU
Tera Guru

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?

1 ACCEPTED SOLUTION

@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.

find_real_file.png

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

16 REPLIES 16

Hi amaradiswamy,

Clarification please, the below code only display for the incidents, I would like to add the request item also

 

Example - Show all incidents&RITM, please advise how should I achieve this

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); 

Indira Panneers
Tera Contributor

Hi All,

This piece of code is not working for me.

requirement - Display My tickets - Menu in the service portal all time even when there is no active tickets(want both the incidents & request item).

How do I call both

Please help, thanks in advance

var count = 0;
var Rec = new GlideAggregate('sc_req_item');
var Rec = new GlideAggregate('incident');
Rec.addQuery('caller_id', gs.getUserID()).addOrCondition('opened_by',gs.getUserID());
Rec.addActiveQuery();
Rec.addAggregate('COUNT');
Rec.query();
if(Rec.next())
{
Count = Rec.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 = Count;
if(Count == 0)
{
t.count = 'O';
}