Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles / Languages / C#

Adding new tab under uCommerce Admin sections in Umbraco 6.0.0

5.00/5 (3 votes)
24 Sep 2013CPOL2 min read 16.5K  
In this small tip we will discuss a way to add new tabs in the uCommerce admin view.

Introduction

uCommerce provides you inbuilt tabs for different perspectives, for different nodes. Also you can add your own tabs to uCommerce admin view to enhance your own requirements. In this small tip we will discuss a way to add new tabs in the uCommerce admin view. 

Background

A similar approach is documented in an article here, but it is written with reference to an older version of Umbraco. Since the article some APIs and Namespaces have been updated. Hence In the current article we will see how to achieve the similar results in Umbraco 6.0.0.

Using the code

Steps for adding new tab in uCommerce section

1. Add new user control for custom tab view

To add new tab first create new user control in your website, go to website in visual studio add new user control where you want as per your defined directory structure. It is good to place new user control under /usercontrols folder in Umbraco website. So the virtual path for newly created user control will be “../../../usercontrols/TestTab.ascx”.

Inherit newly created user control from Ucommerce.Presentation.Web.Controls.ViewEnabledControl<T> 

The generic parameter T must be type of view which you want to load your user control to appear on. Most commonly used views and their types are discussed below.

Image 1 

So if you are inheriting your user control from any of these views you can register for following events.

C#
event EventHandler<EntityCommandEventArgs<T>> Saving; 
event EventHandler<EntityCommandEventArgs<T>> Saved;
event EventHandler<EntityCommandEventArgs<T>> Deleting;
event EventHandler<EntityCommandEventArgs<T>> Deleted;

2. Insert new row for tab in database

In uCommerce uCommerce_AdminTab refers to uCommerce_AdminPage for parent page container of your tab(usercontrol). So you have to add your usercontrol entry into uCommerce_AdminTab table and should give the AdminPageId from uCommerceAdminPage table to select on which view or page you going to add your new tab. See the visuals

Image 2 

Image 3 

As per the information in the above table you can insert an entry into uCommerce_AdminTab table for new tab. Build your solution and your new tab is ready under the view you have selected. 

Hide/Show custom tab for particular section 

As explained earlier your new tab will be visible for view you have selected, Consider an example where you want to do some functionality Completed Orders (uCommerce >> Orders >> Completed Orders) and if you have followed above steps your new tab will be visible for all remaining sections like New Orders, Requires Attention etc.
To hide or show your tab for particular section only, implement ISection interface in your user control and set the Show property as per your requirement.
For ex: 
C#
public bool Show 
{
	get
	{
		return View.OrderStatus.OrderStatusId == 3;
	}
} 
So this will show your custom user control for Completed Orders only. 

Points of Interest

In this article we have discussed a simple way to add new tabs in the uCommerce admin view. This approach was well documented for an older version of the umbraco. I have done some research and updated it to be useful with Umbraco 6.0.0.

References

History  

Keep a running update of any changes or improvements you've made here.

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)