Adding Admin Tabs from Plugin Helper

1 year ago
To add a tab to a TabStrip requires working with some code that may be harder to work with, and may require allot of duplication from plugin to plugin.  

What would really be helpful to developers is to have an extension method that is part of the main nopCommerce solution that can be reference. This could make it much easier in the plugins, improve reusability, and make upgrading easier, similar to how the RegisterPluginDataContext simplified the data context registration in the plugins.

Below is an extension method I use in my plugins, for version 4.0.
This is working well for me, and helps simplify the calling code.
Unfortunately I still have to copy this into every plugin that needs it, and if the core code changes, this may also have to change in every plugin where it is used.  Can the NOP team just add this into the main solution, then every plugin can just reference it?  

public static HtmlString TabContent(this AdminTabStripCreated eventMessage, string tabId, string tabName, string url)
        {
            return new HtmlString([email protected]"
                <script type='text/javascript'>
                    $(document).ready(function() {{
                        $(`<li><a data-tab-name='{tabId}' data-toggle='tab' href='#{tabId}'>{tabName}</a></li>
                        `).appendTo('#{eventMessage.TabStripName} .nav-tabs:first');

                        $.get('{url}', function(result) {{
                            $(`<div class='tab-pane' id='{tabId}'>` + result + `</div>`).appendTo('#{eventMessage.TabStripName} .tab-content:first');
                        }});
                    }});
                </script>");
}


Example of calling the above extension function from HandleEvent:
public void HandleEvent(AdminTabStripCreated eventMessage)
        {
            if (eventMessage?.Helper == null)
                return;

            if (eventMessage.TabStripName == "vendor-edit")
            {
                string url = new UrlHelper(//... url helper logic here as you need
                
                var vendorTab = eventMessage.TabContent("MyTabId", "My Tab Name", url);
                eventMessage.BlocksToRender.Add(vendorTab);
            }
}


As you can see, the "eventMessage.TabContent" neatly generates the needed tab content for the calling function.
1 year ago
Thanks a lot! We'll consider it in 4.20 - https://github.com/nopSolutions/nopCommerce/issues/3198
1 year ago
Done. Please see this commit for more details.
1 year ago
DmitriyKulagin wrote:
Done. Please see this commit for more details.

Thank you! Looking forward to using this.

Just curious about 1 thing.
For the TabContentByURL function, I see the script block as:
<script type='text/javascript'>

For the TabContentByModel function, I see the script block as:
<script>


Was that intentional or oversight?
1 year ago
Just overlooked this moment. See the additional commit. Thanks a lot!
7 months ago
Hi,

I am trying to add admin tab in admin product edit view using nopcommerce 4.20 beta code.
But, I see that AdminTabStripCreated event is not called on Admin Product Edit Page

I am trying to make my plugin ready for nopcommerce 4.20.
Please Help
7 months ago
Hi,

I am trying to add admin tab in admin product edit view using nopcommerce 4.20 beta code.
But, I see that AdminTabStripCreated event is not called on Admin Product Edit Page

I am trying to make my plugin ready for nopcommerce 4.20.
Please Help
6 months ago
Execula wrote:
Hi,

I am trying to add admin tab in admin product edit view using nopcommerce 4.20 beta code.
But, I see that AdminTabStripCreated event is not called on Admin Product Edit Page

I am trying to make my plugin ready for nopcommerce 4.20.
Please Help


Hi, you could follow this example to add a new panel in the administrator, nopcommerce 4.2 no longer calls the AdminTabStripCreated event

https://github.com/nopSolutions/nopCommerce/blob/develop/src/Plugins/Nop.Plugin.Payments.Qualpay/Views/Customer/_CreateOrUpdate.Qualpay.cshtml
1 month ago
So to be clear, there really is no need to have the AdminTabStripCreated event in v4.2. It's not being called anywhere and the AdminWidgetZones.[X] is a viable replacement.

If that truly is the case, should it be removed as well as the TabContentByURL and TabContentByModel helper methods in the Nop.Web.Framework.HtmlExtensions class?