"Options" Part along with variables in Ticket Fields widget is not visible to End User

[Sohithanjan G]

Hi,

"Options" Part along with variables in Ticket Fields widget is not visible to End User, but its visible for admin users. Ticket Fields widget has both snc_external & snc_internal roles. Please help me with any suggestions.

[Sohithanjan G]

Ticket Fields Widget:

HTML

<div ng-if="data.canRead" class="panel b">
  <div class="panel-heading bg-primary panel-la-jolla-default">
    <div ng-init="spSearch.targetRequests()">
      <sp-c-link target="form" table="data.table" id="data.sys_id"/>
    </div>
    <h2 class="sr-only">${Ticket details}</h2>
    <span ng-if="data.agent" >
      ${Agent working on this {{data.tableLabel}}}:
      <div>{{data.agent}}</div>
    </span>
    <span aria-live="assertive">
    <span ng-if="!data.agent && data.agentPossible" >${Your request has been submitted}</span>
    </span>
    <span ng-if="!data.agentPossible">${{{data.tableLabel}} record details}</span>
  </div>

  <div class="panel-body">
    <dl class="ticket-fields" ng-if="data.fields.length > 0">
        <dt class= "col-md-6 col-sm-12 col-xs-6 break-word"
            ng-if="field.value && (field.type != 'decimal' || field.type == 'decimal' && field.value != 0)"
            ng-repeat-start="field in data.fields">{{field.label}}</dt>
        <dd class= "col-md-6 col-sm-12 col-xs-6 break-word"
            ng-repeat-end ng-switch="field.type"
            ng-if="field.value && (field.type != 'decimal' || field.type == 'decimal' && field.value != 0)">
          <div ng-switch-when="glide_date_time" title="{{field.display_value}}">
            <sn-time-ago timestamp="::field.value" />
          </div>
          <div ng-switch-when="multi_small"><pre class="multi-lines">{{field.display_value}}</pre></div>
          <div ng-switch-default><span class="pre-wrap">{{field.display_value}}</span></div>
        </dd>
    </dl>
    <sp-widget widget="data.variableSummarizerWidget"></sp-widget>
  </div>

  <div ng-if="data.agentPossible && !data.agent && options.pickup_msg" class="panel-footer">
    <div id="ticket_fields_footer" class="text-center text-muted" style="font-style: italic;" ng-bind-html="data.pickupMsg">
    </div>
  </div>

</div>

Server Side:

(function(){
	data.pickupMsg = gs.getMessage(options.pickup_msg);
	var gr = $sp.getRecord();
	if (gr == null)
		return;

	data.canRead = gr.canRead();
	if (!data.canRead)
		return;

	var agent = "";
	var a = $sp.getField(gr, 'assigned_to');
	if (a != null)
		agent = a.display_value;

	var fields = $sp.getFields(gr, 'number,state,priority,sys_created_on');
	if (gr.getValue("sys_mod_count") > 0)
		fields.push($sp.getField(gr, 'sys_updated_on'));

	if (gr.getValue('price') > 0)
		fields.push($sp.getField(gr, 'price'));

	if (gr.getValue('recurring_price') > 0) {
		var rp = $sp.getField(gr, 'recurring_price');
		if (gr.isValidField("recurring_price"))
			rp.display_value = rp.display_value + " " + gr.getDisplayValue("recurring_frequency");
		fields.push(rp);
	}
	if (gr.isValidField("quantity"))
		fields.push($sp.getField(gr, 'quantity'));

	data.tableLabel = gr.getLabel();
	data.fields = fields;
	data.variables = new GlobalServiceCatalogUtil().getVariablesForTask(gr, true);
	data.agent = agent;
	data.agentPossible = gr.isValidField("assigned_to");
	data.table = gr.getTableName();
	data.sys_id = gr.getUniqueValue();
	data.variableSummarizerWidget = $sp.getWidget('sc-variable-summarizer', {'variables' : data.variables, 'toggle' : true, 'task' : fields[0].value});
})()

Client Side:

function ($scope, spUtil) {
	spUtil.recordWatch($scope, $scope.data.table, "sys_id=" + $scope.data.sys_id);
}

[Ishaan Shoor · Accepted solution]

Can you update the variable summarizer to the below and try again:

HTML

<div ng-if="c.data.variables.length > 0" ng-init="c.variable_toggle = c.toggle">
  <button class="btn variables-toggle-btn" aria-expanded="{{c.variable_toggle}}" aria-label="{{data.ariaLabel}}" ng-click="c.variable_toggle = !c.variable_toggle" ng-if="!c.hide_control">
    <span style="font-size: 12px;" class="glyphicon" ng-class="c.variable_toggle ? 'glyphicon-chevron-down' : 'glyphicon-chevron-up'"></span>
    {{data.label}}
  </button>

  <div ng-if="c.variable_toggle" id="variables-toggle" aria-hidden="{{!c.variable_toggle}}">
    <hr role="presentation" ng-if="!c.hide_control">
    <div class="m-b break-word" ng-repeat="variable in c.data.variables">
      <label class="m-t-xs m-b-none text-muted"><b>{{::variable.label}}</b></label>
      <div ng-if="!variable.multi_row">
        <div ng-switch="variable.type">
          <!-- 27 is type URL, 33 is type Attachment -->
          <a ng-switch-when="27" class="pre-wrap" title="{{::variable.label}}" href="{{::variable.display_value}}" target="_blank">{{::variable.display_value}}</a>
          <span ng-switch-when="33" class="file-attachment">
          	<a ng-if="::variable.state != 'not_available'" class="pre-wrap" title="{{::variable.label}}" href="javascript:void(0);" ng-click="scanAttachment(variable)" aria-label="${Download {{variable.display_value}}}">{{::variable.display_value}}</a>
            <span ng-if="::variable.state == 'not_available'" class="error">
							<a class="pre-wrap" title="{{::variable.label}}" href="javascript:void(0);" ng-click="scanAttachment(variable)" aria-label="${File {{variable.display_value}} failed security scan}">{{::variable.display_value}}</a>
             	(${File failed security scan})
            </span>
          </span>
          <span ng-switch-default class="pre-wrap">{{::variable.display_value}}</span>
        </div>
      </div>
      <div ng-if="variable.multi_row">
        <a href="javascript:void(0)" class="hidden-xs" uib-popover-template="'sp_multirow_vs_summarizer.html'" popover-title="{{variable.label}}" popover-placement="auto top" popover-append-to-body="true" popover-trigger="outsideClick">${Click to view}</a>
        <a href="javascript:void(0)" class="visible-xs" ng-click="c.openMrvsModal(variable)">${Click to view}</a>
      </div>
    </div>
  </div>
</div>

Server Script:

(function() {
	data.label = options.label || gs.getMessage("Options");
	if(options.task)
		data.ariaLabel =  gs.getMessage("{0} for {1}", [data.label, options.task]);
	else
		data.ariaLabel = data.label;
	if (options.variables) {
		data.variables = filterVariables(options.variables);
		return;
	}
	data.labelClose = gs.getMessage("Close");
	var tableName = options.table || $sp.getParameter('table');
	var sysId = options.sys_id || $sp.getParameter('sys_id');
	var record = sn_std_tkt_api.TicketConfig.getTicketRecord(tableName, sysId);
	
	if (record == null)
		return;

	data.canRead = record.canRead();
	if (!data.canRead)
		return;
	
	data.variables = filterVariables(new GlobalServiceCatalogUtil().getVariablesForTask(record, true));
	
 })();

function filterVariables(variables) {
	if (variables == null || variables.length == 0)
		return variables;
	
	var filteredVariables = [];
	variables.forEach(function(variable) {
		if (variable.visible_summary)
			filteredVariables.push(variable);
	});
	
	return filteredVariables;
}

Client Script:

function($scope, snAttachmentHandler, i18n, spModal) {
  /* widget controller */
  var c = this;
	c.toggle = c.options.toggle || false;
	c.hide_control = c.options.hide_control || false;
	c.task = c.options ? c.options.task : "";
	
	/* Open mrvs data in a model for mobile screen */
	c.openMrvsModal = function(data) {
		spModal.open({
			title: data.label,
			widget: "template_renderer",
			widgetInput: {data: data, template: "sp_multirow_vs_summarizer.html"}, 
			buttons: [{label:c.data.labelClose, primary: true}]
		});	
	}
	
	$scope.scanAttachment = function(variable) {
		if (variable.state == 'not_available')
			snAttachmentHandler.showMessage('error',i18n.getMessage('Upload file scan failed').withValues([variable.display_value]));
		else
			snAttachmentHandler.scanAttachment({'sys_id' : variable.value});
	}
}

CSS:

button.variables-toggle-btn {
		background: none;
		border: none;
		color: $link-color;
		&:hover, &:focus{
		color: $link-hover-color;
		text-decoration: $link-hover-decoration;
	}
}

[Sohithanjan G]

Hi Ishaan, Thanks for the update. Its still not showing to the end user when calling from another widget. Its is showing using directly

[Ishaan Shoor]

Hi Sohith, would you like to connect on a call? 

https://meet.google.com/isr-sjtf-tow

Let me know.

[Ishaan Shoor]

Hi Sohith, would you like to connect on a call? 

https://meet.google.com/isr-sjtf-tow

Let me know. It's working fine on my end.