We can update the menu icon of my account tree on the basis of having unread messages or read messages in the notification center. This functionality is made possible by using the extension to create the configuration field in NetSuite to add the image for the icon. Then obtain the value of the unread message from the backend and change the image of the icon in the configuration file based on the value.
Configuration file:
{
"type": "object",
"subtab": {
"id": "Menu_tab",
"title": "Menu Icon",
"description": "Myaccount Configurator for SC setup",
"group": "extensions",
"docRef": ""
},
"properties": {
"MyaccountExtension.config": {
"group": "extensions",
"subtab": "MyaccountExtension_subtab",
"type": "string",
"title": "MyaccountExtension_Title",
"description": "Config description example",
"default": "Default config example"
},
"MyaccountExtension.Notification": {
"group": "extensions",
"subtab": "Menu_tab",
"type": "string",
"title": "Notification_icon",
"description": "Notification_icons",
"default": "https://www.enlightenprofessional.tk/SSP Applications/NetSuite Inc. - SCA 2021.2.0/Development/img/En_notification_open.svg"
},
"MyaccountExtension.NotificationRead": {
"group": "extensions",
"subtab": "Menu_tab",
"type": "string",
"title": "Notification_Read_icon",
"description": "Notification_Read_icon",
"default": "https://www.enlightenprofessional.tk/SSP Applications/NetSuite Inc. - SCA 2021.2.0/Development/img/En_notification_read.svg"
}
}
}
Javascript Entry point file:
define(
'JJ.MyaccountExtension.MyaccountExtension', [
'Balance.View', 'CreditCard.Edit.Form.View', 'CreditCard.View',
"MenuTree.View", 'Address.List.View', 'GlobalViews.Confirmation.View',
'Utils', 'Overview.Shipping.View', 'Quote.List.View', 'RecordViews.View', 'JJ.MyaccountExtension.MyaccountExtension.View',
'JJ.MyaccountExtension.MyaccountExtension.Model'
],
function (
BalanceView, CreditCardEditFormView,
CreditCardView, MenuTreeView, AddressListView,
GlobalViewsConfirmationView, Utils, OverviewShippingView, QuoteListView, RecordViewsView, MyaccountExtensionView, Model
) {
'use strict';
var no_of_unread = 0;
return {
mountToApp: function mountToApp(container) {
/** @type {LayoutComponent} */
var layout = container.getComponent('Layout');
/**
* The function is used for sidebar to check the current page.
*/
_.extend(MenuTreeView.prototype, {
updateSidebar: function (label) {
this.currentLabel = label;
const target = this.$('[data-id="' + this.currentLabel + '"]');
const target_expandable = target.closest('[data-type="menu-tree-node-expandable"]');
const anchors = this.$('[data-id]');
// remove active for all anchors and add for this one
anchors.removeClass('active');
target.addClass('active');
// triggers click for the correct expander
target_expandable
.find('[data-action="expander"]:first')
.trigger('click', {
synthetic: true
});
// edge case for home, should close other expanders
if (label === 'home') {
const all_expandables = this.$('[data-type="menu-tree-node-expandable"]');
const open_expanders = this.$('[data-type="menu-tree-node-expander"].in');
all_expandables.removeClass('open');
}
},
getContext: _.wrap(MenuTreeView.prototype.getContext, function (fn) {
var originalRet = fn.apply(this, _.toArray(arguments).slice(1));
var menu = originalRet.menuItems;
var service_url = Utils.getAbsoluteUrl(getExtensionAssetsPath("services/MyaccountExtension.Service.ss"));
$.ajax({
method: "GET",
url: service_url,
})
.done(function (data) {
no_of_unread = data;
});
console.log( 'menu', no_of_unread);
var MyaccountExtension = SC.CONFIGURATION.MyaccountExtension;
var Notification = MyaccountExtension.Notification
var NotificationRead = MyaccountExtension.NotificationRead
menu.splice(1, 1);
menu.splice(2, 1);
menu.forEach((e, i) => {
if (e.name === 'Notification Centre') {
if (no_of_unread >= 1) {
menu[i].icon1 = Notification;
menu[i].icon2 = Notification;
} else {
menu[i].icon1 = NotificationRead;
menu[i].icon2 = NotificationRead;
}
}
});
return originalRet;
})
});
}
};
});
Suite script
// JJ.MyaccountExtension.MyaccountExtension.js
// Load all your starter dependencies in backend for your extension here
// ----------------
define('JJ.MyaccountExtension.MyaccountExtension', [
'JJ.MyaccountExtension.MyaccountExtension.ServiceController', 'SC.Model', 'underscore', 'SC.Models.Init'
], function (
MyaccountExtensionServiceController, SCModel, _, ModelsInit
) {
'use strict';
return SCModel.extend({
name: 'JJ.MyaccountExtension.MyaccountExtension',
Search: function () {
try {
var field = ModelsInit.customer.getFieldValues();
var customrecord_jj_notificationSearch = nlapiSearchRecord("customrecord_jj_notification", null,
[
["custrecord_jj_notification_customer", "anyof", field.internalid],
"AND",
["custrecord_jj_read", "is", "F"],
"AND",
["custrecord_jj_display_in_website", "is", "T"]
],
[
new nlobjSearchColumn("custrecord_jj_message"),
new nlobjSearchColumn("internalid"),
new nlobjSearchColumn("formulatext").setFormula("TO_CHAR({custrecord_jj_notification_date} , ' Month DD, YYYY')").setSort(true),
new nlobjSearchColumn("created"),
new nlobjSearchColumn("custrecord_jj_message_subject"),
new nlobjSearchColumn("formulatext1").setFormula("TO_CHAR({custrecord_jj_notification_date} , 'DD/MM/YYYY')"),
new nlobjSearchColumn("custrecord_jj_read")
]
);
if (customrecord_jj_notificationSearch) {
var results = customrecord_jj_notificationSearch.length;
console.log("resultsruthy", results);
console.log("resultsruthy", JSON.stringify(results));
return JSON.stringify(results);
} else {
var result = 0;
return JSON.stringify(result);
}
} catch (e) {
// statements
console.error('filter-error', e);
return {
status: 500,
code: 'ERR_FORM',
message: 'There was an error filter' + e
}
}
}
});
});
Suite script entry point file
define("JJ.MyaccountExtension.MyaccountExtension.ServiceController", ["ServiceController", "JJ.MyaccountExtension.MyaccountExtension"], function(
ServiceController, MYEXTENSION
) {
"use strict";
return ServiceController.extend({
name: "JJ.MyaccountExtension.MyaccountExtension.ServiceController",
// The values in this object are the validation needed for the current service.
options: {
common: {}
},
get: function get() {
var valuestored = MYEXTENSION.Search();
//console.log("DEBUG1", JSON.parse(valuestored));
console.log("DEBUG3", valuestored);
return valuestored;
},
post: function post() {
// not implemented
},
put: function put() {
// not implemented
},
delete: function() {
// not implemented
}
});
});