How to call one widget data fromn another widget.

thaduri sai
Tera Contributor

‎01-28-2024 02:17 AM

we have two widgets. in one widget we have a buton called Action. Basically by using this button the end user can perform action oin their incidents like Resove, Reopen, Close.

so now we are implementing a functionality which supports Escation from the incident from.

so we have created a widget called "Escalation' and defined funcitons to work accordingly.

now the requiremnt is we have to embed that Escalation button in the exisiting Action menu.

Please sinf the screenshot below

thadurisai_0-1706436393576.png

 

Please find the widget Scripts we wrote and kindly alter / update to work

Escalation widget Scripts:

 

 

Body HTML Template:

<div class="action_button panel b" ng-if="data.showWidget" >
<!--<div class="panel b" ng-if="data.showWidget" ng-if = "!data.first_escalation" > -->
<button type="button" class="btn btn-danger btn-block" ng-click = "c.uiAction('cancel')" ng-disabled = "data.first_escalation"> <font size = "+1" face="Arial" color="white" data-toggle="tooltip" title="Click to escalate this issue to the Support Team Manager." > ${Escalation} </font> </button>
</div>

<script>
$(document).ready(function(){
$('[data-toggle="tooltip"]').tooltip();
});
</script>

 

SERVER Script:

(function() {


// Get table & sys_id
data.table = input.table || $sp.getParameter("table");
data.sys_id = input.sys_id || $sp.getParameter("sys_id");

// Valid GlideRecord
var gr = new GlideRecord(data.table);
if (!gr.isValid())
return;


// Valid sys_id
if (!gr.get(data.sys_id))
return;

    // set assigned to value to send email notification
   
    var inc = new GlideRecord(data.table);
    inc.addQuery('sys_id',data.sys_id);
    inc.query();
    if(inc.next()){
   
        if(inc.sys_class_name == 'incident' && inc.caller_id == gs.getUserID() && inc.sys_created_on < gs.hoursAgo(24) && (inc.state == 2 || inc.state == 3)){
data.showWidget = true;
}else {
data.showWidget = false;
}
   

    if(input.action){
       
        if(inc.u_escalate_count <= 1){
        inc.work_notes = "Escalation by caller";
        inc.u_escalate_count += 1;
        inc.u_escalated_state = 'escalation_proposed';  
        inc.update();
        inc.setWorkflow(false);
        }
       
    }
if (inc.u_escalate_count <= 1)
{data.first_escalation = true;
}
    else
        {
            data.first_escalation = false;
        }
       
    }
})();
 
Client Controller:
 
function ($scope,spUtil, spModal) {
var c = this;
    spUtil.recordWatch($scope, $scope.data.table, "sys_id=" + $scope.data.sys_id);
   
c.uiAction = function(action){
   
    spModal.open({
        message: "${Are you sure you want to escalate the ticket?}",
        title: "${Escalation Confirmation}",
        footerStyle: {},
        size: "md",
        buttons: [
            {
                label: "${Cancel}",
                cancel: true
            },
            {
                label: "${Ok}",
                primary: true
            }
        ]
    }).then(function() {
        c.disable = true;
        c.data.action = action;
        c.server.update().then(function() {
            c.data.action = undefined;
        })
    });
}
 
------------------------------------------------------------
Cloned Widget Script for Action Button:
 
Body HTML:
<div>
<div class="dropdown" id="child-case-tabs" ng-if="data.showActions">
<button type="button" id="actions-button" class="btn btn-default dropdown-toggle action-btn" data-toggle="dropdown" style="width : 100%" aria-haspopup="true" ng-init="setFocusOnActionButtons()">
${Actions}
<span class="fa fa-caret-down"></span>
</button>
<ul class="dropdown-menu pull-right" id="actionList">
<li ng-if="data.canResolve">
<a href="javascript&colon;void(0)" ng-click="$event.stopPropagation();resolveIncident()">${Resolve}</a>
</li>
<li ng-if="data.canReopen">
<a href="javascript&colon;void(0)" ng-click="$event.stopPropagation();reopenIncident()">${Reopen}</a>
</li>
<li ng-if="data.canClose">
<a href="javascript&colon;void(0)" ng-click="$event.stopPropagation();closeIncident()">${Close}</a>
</li>
</ul>
</div>

</div>
Server Script:
(function() {
    var incidentGr = new GlideRecord('incident');
    var incidentSysId = options.sys_id;
   
    if (!incidentSysId && $sp.getParameter('table') == 'incident')
        incidentSysId = $sp.getParameter('sys_id');
   
    if (!incidentSysId && $sp.getParameter('table') == 'universal_request') {
        var urGr = new GlideRecord('universal_request');
        urGr.get($sp.getParameter('sys_id'));
        incidentSysId = urGr.primary_task + "";
    }
   
    /* Actions - Start */
    if (input && input.action == 'resolveIncident' && incidentGr.get(incidentSysId) && hasPermissions(incidentGr, "write")) {
        incidentGr.incident_state = global.IncidentState.RESOLVED;
        incidentGr.state = global.IncidentState.RESOLVED;
        incidentGr.resolved_by = gs.getUserID();
        data.isIncidentResolved = incidentGr.update();
    }
   
    if (input && input.action == 'reopenIncident' && incidentGr.get(incidentSysId) && hasPermissions(incidentGr, "write")) {
        incidentGr.incident_state = global.IncidentState.IN_PROGRESS;
        incidentGr.state = global.IncidentState.IN_PROGRESS;
        data.isIncidentReopened = incidentGr.update();
        gs.addInfoMessage(gs.getMessage("Request reopened"));
    }
   
    if (input && input.action == 'closeIncident' && incidentGr.get(incidentSysId) && hasPermissions(incidentGr, "write")) {
        incidentGr.incident_state = global.IncidentState.CLOSED;
        incidentGr.state = global.IncidentState.CLOSED;
        data.isIncidentClosed = incidentGr.update();
    }

   /* Actions - End */
   
    /* Load incident data */
    if (incidentGr.get(incidentSysId) && hasPermissions(incidentGr, "read")) {
        var incidentUtils = new global.IncidentUtils();
        data.canResolve = incidentUtils.canResolveIncident(incidentGr);
        data.canReopen = incidentUtils.canReopenIncident(incidentGr);
        data.canClose = incidentUtils.canCloseIncident(incidentGr);
        data.showActions = data.canResolve || data.canReopen || data.canClose;
    }

    function hasPermissions(gr, operation) {
        if (operation == "read" && gr.canRead())
            return true;

        if (operation == "write" && gr.canWrite())
            return true;

        return (gr.getValue("caller_id") == gs.getUserID()) || (gr.getValue("opened_by") == gs.getUserID());
    }

    data.i18n = {};

})();
Client Controller:
 
function incidentTicketActions($scope, $http, spUtil, $timeout, spModal, i18n, $window, $uibModal, spAriaUtil) {
    /* widget controller */
    var c = this;
    c.doneLoading = false;
    c.resolvedIncidentMsg = "${Resolved Incident}";
    c.closedIncidentMsg = "${Closed Incident}";
    c.reopenedIncidentMsg = "${Reopened Incident}";

    var MOBILE_DEVICE_SCREEN_WIDTH = 767;
    $scope.mobileDevice = c.data.isMobile || ($window.innerWidth < MOBILE_DEVICE_SCREEN_WIDTH);

    $scope.resolveIncident = function() {
        $scope.data.action = 'resolveIncident';
        $scope.server.update(init).then(function(response){
                    if (response.isIncidentResolved)
                        spAriaUtil.sendLiveMessage(c.resolvedIncidentMsg);
                });
        $scope.$emit('focusOnActions', {"isFocusRequired": true});
    };
   
    $scope.closeIncident = function() {
        $scope.data.action = 'closeIncident';
        $scope.server.update(init).then(function(response){
                    if (response.isIncidentClosed)
                        spAriaUtil.sendLiveMessage(c.closedIncidentMsg);
                });
        var elm = document.getElementById('short-desc')
        elm.focus();
    };

    $scope.reopenIncident = function() {
        $scope.data.action = 'reopenIncident';
        $scope.server.update(init).then(function(response){
                    if (response.isIncidentReopened)
                        spAriaUtil.sendLiveMessage(c.reopenedIncidentMsg);
                });
            $scope.$emit('focusOnActions', {"isFocusRequired": true});
    };

    function init() {}
   
    $(document).on('click', 'div.modal-footer button.btn, ul#child-case-tabs .dropdown-menu', function(e) {
        e.stopPropagation();
    });

    $(document).bind('dragover drop', function(event) {
        event.preventDefault();
        return false;
    });

    $scope.$on('sp_loading_indicator', function(e, value) {
        if (!value && !c.doneLoading) {
            c.doneLoading = true;
        }
    });
}\
 
LINK:
function link(scope, element, attrs, controller) {
  scope.setFocusOnActionButtons = function() {
        if (scope.widget.isFocusRequired) {
            var elm = element.find('#actions-button')[0];
            elm.focus();
        }
    }
}
0 Helpfuls
  • 546 Views
1 REPLY 1

Community Alums
Not applicable

‎01-28-2024 07:05 PM

Hi @thaduri sai ,

HTML

<div>
  <div>
<sp-widget widget="data.example"></sp-widget>
  </div>
</div>

Server

data.example = $sp.getWidget('anotherwidgetid', {});

 

Also, watch this video : https://www.youtube.com/watch?v=uEK0SWiiZ3E

 

0 Helpfuls