Report Drilldown on csm portal for report widget

[snowDeveloper_1]

Hello Experts,

I have a requirement to show a report on csm portal and can able to show that using report portal, but whenever I clicked on any report section from donut it was redirecting me to the backend list view with correct filter and record count but I wanted user to get the report list view on csm portal only. I did that by cloning the widget and making modification in scripts. but after clicking on any donut product I'm not able to fetch that product sys id and it shows me all the records which are part of that donut/report. But I want only that selected products to get display. How I can achieve that ?

HTML 

<div class="report-widget-wrap">
  <h2 ng-if="c.showTitle" tabindex="0" id="{{'title-' + c.rectangleId }}" class="report-widget-title">{{c.title}}</h2>
  <div id="report-widget-{{c.rectangleId}}" ng-click="c.openListView()">
    {{::c.initialMessage}}
  </div>
</div>

Server:

(function() {

    options.report_id = options.report_id || '';

    var reportGr = new GlideRecord('sys_report');
    if (reportGr.get(options.report_id)) {
        var tableName = reportGr.table;
        var encodedQuery = reportGr.filter;
        var getField = reportGr.field;
        if (getField) {
            data.portalListURL = '/csm?id=report_drilldown&table=' + tableName + '&filter=' + encodeURIComponent(encodedQuery) + '%5E' + getField + '=';
        } else {
            data.portalListURL = '/csm?id=report_drilldown&table=' + tableName + '&filter=' + encodeURIComponent(encodedQuery);
        }
        options.title = reportGr.getDisplayValue('title');
    }

    var chartHelpers = chartHelpers || {};
    chartHelpers.i18n = chartHelpers.i18n || {};
    chartHelpers.i18n.selectReport = gs.getMessage('Select a report in widget options!');
    chartHelpers.i18n.building = gs.getMessage('Building chart, please wait...');
    chartHelpers.i18n.total = gs.getMessage('Total');
    chartHelpers.i18n.maxCells = gs.getMessage('The size of the pivot table is too big. Use filters to reduce it or switch to a modern browser.');
    chartHelpers.i18n.chartGenerationError = gs.getMessage('An error occurred while generating chart. Please try again later.');
    //... Keep rest of the chartHelpers initialization as is ...
    chartHelpers.device = {};
    chartHelpers.device.type = GlideMobileExtensions.getDeviceType();

    chartHelpers.systemParams = {
        firstDay: (gs.getProperty("glide.ui.date_format.first_day_of_week", 2) - 1) % 7,
        defaultDate: SNC.ReportUtil.getNowTimeInUSFormat(),
        maxEventsDisplayedPerCell: gs.getProperty("glide.report.calendar.max_events_displayed_per_cell", 3),
        maxMoreEventsPerDay: gs.getProperty("glide.report.calendar.max_more_events_per_day", 30),
        defaultEventDuration: gs.getProperty("glide.report.calendar.default_event_duration", "01:00:00"),
        maxDaysBack: gs.getProperty("glide.report.calendar.max_days_back", 30),
        enablePreviewOnHover: gs.getProperty("glide.report.calendar.enable_preview_on_hover", false)
    };

    data.rectangleId = gs.generateGUID();
    data.ch = chartHelpers;
})();

If I get the product sys id then I can pass it in front of getField for below query.

data.portalListURL = '/csm?id=report_drilldown&table=' + tableName + '&filter=' + encodeURIComponent(encodedQuery) + '%5E' + getField + '=' //over here product sys id

Client Controller :

function($timeout, $window) {
  var c = this;
  var reportId = c.options.report_id || '';
 // alert(reportId);
  c.rectangleId = c.widget.rectangle_id || c.data.rectangleId;

  c.showTitle = (c.options.show_title === true || c.options.show_title === 'true');
  c.title = c.options.title || '';

  if (c.options.widget_parameters) {
    c.initialMessage = c.data.ch.i18n.building;
    window.chartHelpers = window.chartHelpers || {};
    $.extend(window.chartHelpers, c.data.ch);
    $timeout(function () {
      var targetEl = $("#report-widget-" + c.rectangleId);
      embedReportById(targetEl, reportId);
    });
  } else {
    c.initialMessage = c.data.ch.i18n.selectReport;
  }

  c.openListView = function () {
	//c.id = $scope.data.id;
	//alert('Product Sys ID: '+g_form.getUniqueValue());
    if (c.data.portalListURL) {
      $window.location.href = c.data.portalListURL;
    }
  };
}