Service Portal displaying Requested Item
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
08-25-2016 12:33 AM
Hi all,
Trying to make it a bit easier for navigation between REQ/RITM for the end users via the Service Portal.
Our users seem to have some dificulty finding their RITM details when they head into a REQ. so I would like to edit the requested Items widget that displays this info.
How it is by default:
How I would like it: (edited with Chromes Inspect feature)
my javascript is non existent (looking to work on it I swear), so not sure where I should be making the changes? Below is the server script (default Requested Items widget). I have created a copy of the widget.
// populate the 'data' variable provided by caller
(function() {
var gr = new GlideRecord("sc_req_item"); // does ACL checking for us
gr.addQuery("request", $sp.getParameter("sys_id"));
options.secondary_fields = options.secondary_fields || "";
options.secondary_fields = options.secondary_fields.split(",");
if (options.order_direction == "asc")
gr.orderBy(options.order_by);
else
gr.orderByDesc(options.order_by);
if (options.maximum_entries > 0)
gr.setLimit(options.maximum_entries);
gr.query();
data.actions = [];
data.list = [];
while (gr.next()) {
if (!gr.canRead())
continue;
if (gr.getRowCount() == 1)
data.conversation_title = gr.request.getDisplayValue() + " - " + gr.getValue("short_description");
var record = {};
record.sys_id = gr.sys_id.getDisplayValue();
if (options.image_field) {
record.image_field = gr.getDisplayValue(options.image_field);
if (!record.image_field)
record.image_field = "/noimage.pngx";
}
if (options.display_field)
record.display_field = gr.getDisplayValue(options.display_field);
record.secondary_fields = [];
options.secondary_fields.forEach(function(f) {
record.secondary_fields.push(getField(gr, f));
});
if (options.sp_page_dv)
record.url = "?id="+options.sp_page_dv+"&table="+options.table+"&sys_id="+record.sys_id+"&view=sp";
else
record.url = "";
record.stage = gr.getValue("stage");
// get appropriate Stage choices for this requested item
var cl = new GlideChoiceList();
GlideController.putGlobal("answer", cl);
GlideController.putGlobal("current", gr);
sc_req_item_stageGetChoices();
record.cl = JSON.parse(cl.toJSON());
data.list.push(record);
}
if (gr.getRowCount() > 1)
data.conversation_title = gr.request.getDisplayValue() + " - " + gr.getRowCount() + " items";
function getField(gr, name) {
var f = {};
f.display_value = gr.getDisplayValue(name);
f.value = gr.getValue(name);
var ge = gr.getElement(name);
f.type = ge.getED().getInternalType()
f.label = ge.getLabel();
return f;
}
})();
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
09-30-2016 01:20 AM
Here is an updated version of the HTML template to make it display more correctly on closed items or items waiting an approval
the correction is in line 11 and 32
<div ng-if="item.cl.length > 0" ng-show="!item.expand" class="requested-items-flex-container">
<div class="flex-item" ng-click="toggle($event, item)"><img src="images/filter_hide16.gifx" /></div>
<div class="flex-item">
<span ng-repeat="stage in item.cl">
<span ng-if="stage.value == item.stage && item.active=='true' && stage.value !='request_approved'">
<img src="/images/heisenberg_icons/stage_icons/icon-arrow-right.png" data-toggle="tooltip" data-placement="top" ng-attr-title="{{stage.label}}" />
</span>
<span ng-if="stage.value !='request_approved' && (indexByKeyValue(item.cl,'value',item.stage) > $index || item.active=='false')">
<img src="/images/sp-icon-check-circle.png" data-toggle="tooltip" data-placement="top" ng-attr-title="{{stage.label}}" />
</span>
<span ng-if="indexByKeyValue(item.cl,'value',item.stage) < $index && indexByKeyValue(item.cl,'value',item.stage) && item.active=='false'">
<img src="/images/sp-icon-empty-circle.png" data-toggle="tooltip" data-placement="top" ng-attr-title="{{stage.label}}" />
</span>
</span>
</div>
</div>
<div ng-if="item.cl.length > 0" ng-show="item.expand" class="requested-items-flex-container">
<div class="flex-item" ng-click="toggle($event, item)"><img src="images/filter_reveal16.gifx" /></div>
<div class="flex-item">
<div ng-repeat="stage in item.cl">
<div ng-if="stage.value !='request_approved'">
<div ng-if="stage.value == item.stage && item.active=='true'" class="stage-on">
<img src="/images/heisenberg_icons/stage_icons/icon-arrow-right.png" />
{{stage.label}}
</div>
<div ng-if="indexByKeyValue(item.cl,'value',item.stage) > $index || item.active=='false'" class="stage-on">
<img src="/images/sp-icon-check-circle.png" />
{{stage.label}}
</div>
<div ng-if="indexByKeyValue(item.cl,'value',item.stage) < $index && indexByKeyValue(item.cl,'value',item.stage) && item.active=='false'" class="stage-off text-muted">
<img src="/images/sp-icon-empty-circle.png" />
{{stage.label}}
</div>
<div>
</div>
</div>
</div>
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
10-26-2016 05:06 PM
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
10-31-2016 01:30 PM
I ran in to the same thing. You need to go to the widget instance, and add this code to the Additional options, JSON format:
{
"always_show": {
"displayValue": false,
"value": false
},
"image_field": {
"value": null,
"displayValue": ""
},
"secondary_fields": {
"value": "number",
"displayValue": "number"
},
"panel_body_height": {
"value": null,
"displayValue": ""
},
"rounded_images": {
"displayValue": false,
"value": false
}
}
(This is copied from the original Requested Items widget)
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
11-06-2016 09:04 PM
Hi cbester
Thanks for the guidance! however still issue with displaying all the states as it is showing only current and previous states not the future stages. Can you please help me with the entire code just to check what i am missing.
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
12-19-2016 07:04 AM
I fixed this by changing the condition on line 32 to:
<div ng-if="indexByKeyValue(item.cl,'value',item.stage) < $index && indexByKeyValue(item.cl,'value',item.stage) && item.active=='true'" class="stage-off text-muted">
Specifically, item.active=='false', was returning false so I changed it to item.active=='true'