Add extra tab to Admin > Edit Order Details

Hello,

Without modifying the NOP core is it possible to add an additional tab to the Admin > Edit Order Details page please?

At the moment it has tabs of "Info", "Billing Info", "Shipping Info", "Products" & "Order notes"

I have a requirement to add an additional tab to this page which has custom functionality in the tab....

Is this possible and can anyone suggest the best way to achieve it please?

Many thanks

[email protected] wrote:

Yes. It is possible. You can create a plugin.

Go through the followings===> http://alexwolfthoughts.com/overriding-nopcommerce-admin-views-and-partial-views/

===> https://www.nopcommerce.com/boards/t/27039/plugin-override-admin-route.aspx

Hi Sohel,

I have had a read of the article you posted a link to.

From what I understand it's describing how to "override" and existing admin menu option and not how to add an additional one.

Am I misunderstanding something?

Trev

[email protected] wrote:

You will able to to "override" admin route. And then you can add an additional one. you can copy all from existing into your plugin and add there new feature from Plugin.

[email protected] wrote:

Hi,

Yes, it is possible.

All you need to do is to inherit from the IConsumer interface and implement the required method.

Here is a simple example:

public class AdminTabStripConsumer : IConsumer<AdminTabStripCreated>
{
  public void HandleEvent(AdminTabStripCreated tabEventInfo)
  {
    if (tabEventInfo != null && !string.IsNullOrEmpty(tabEventInfo.TabStripName))
    {
      if (tabEventInfo.TabStripName == "order-edit")
      {
        var urlHelper = new UrlHelper(HttpContext.Current.Request.RequestContext);

        object objectId = HttpContext.Current.Request.RequestContext.RouteData.Values["id"];

        if (!string.IsNullOrEmpty(objectId.ToString()))
        {
          string text = "Additional tab";
          string content = urlHelper.Action("YourController", "YourAction", new { id = objectId });

          tabEventInfo.BlocksToRender.Add(
            new MvcHtmlString(
              "<script>" +
                "$(document).ready(function() {" +
                  "$('#product-edit').data('kendoTabStrip').append(" +
                    "[{" +
                      "text: '" + text + "'," +
                      "contentUrl: '" + content + "'" +
                    "}]" +
                  ");" +
                "});" +
              "</script>"
            )
          );
        }
      }
    }
  }
}

tabEventInfo.TabStripName == "order-edit" - order-edit is the name of the tabstrip, which is defined in the "Presentation\Nop.Web\Administration\Views\Order\Edit.cshtml".

string content = urlHelper.Action("YourController", "YourAction", new { id = objectId }); - change YourController and YourAction to correspond with yours.

In the controller, you can define your logic for preparing the view. Example:

public ActionResult Action(int? id)
{
        // Add some logic, if you have any.
  return PartialView("Path/to/your/View.cshtml", id);
}

View.cshtml:

@model int?

@{
    var productId = Model;

    if (productId == null)
    {
        <div>Save before edit</div>
        return;
    }
}

<div>Your code here</div>

This will render an additional tab with name "Additional tab" and when you click it, it will make a request to your controller and action to get the html.

Hope this helps!

If there is anything that is not clear, please ask!

Regards,
Hristian

Nop-Templates.com wrote:

Forgot one more thing -

"$('#product-edit').data('kendoTabStrip').append(" +

The bolded text should be "order-edit"!

that looks brilliant!

and it doesn't mean amending any of the nop core?

Trev

[email protected] wrote:

Hi,

Yes, you don't have to change anything in the nop core.

Regards,
Hristian

I have just got this working and it is PERFECT!!

I have not had to modify any core code...

Thank you very VERY much for your help!!

Trev

Hi Hristian,

Thanks for the code it helped, just wanted to know is there any way we can save the changes done on this Tab.

Regards
Sree