Added abp-tab-link tag helper

resolved https://github.com/abpframework/abp/issues/551

framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Tab/AbpTabLinkTagHelper.cs

@@ -0,0 +1,22 @@
+using Microsoft.AspNetCore.Razor.TagHelpers;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Tab
+{
+    [HtmlTargetElement("abp-tab-link", TagStructure = TagStructure.WithoutEndTag)]
+    public class AbpTabLinkTagHelper : AbpTagHelper<AbpTabLinkTagHelper, AbpTabLinkTagHelperService>
+    {
+        public string Name { get; set; }
+
+        public string Title { get; set; }
+
+        public string ParentDropdownName { get; set; }
+
+        public string Href { get; set; }
+
+        public AbpTabLinkTagHelper(AbpTabLinkTagHelperService tagHelperService)
+            : base(tagHelperService)
+        {
+
+        }
+    }
+}

framework/src/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap/TagHelpers/Tab/AbpTabLinkTagHelperService.cs

@@ -0,0 +1,46 @@
+using System.Collections.Generic;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Razor.TagHelpers;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Tab
+{
+    public class AbpTabLinkTagHelperService : AbpTagHelperService<AbpTabLinkTagHelper>
+    {
+        public override async Task ProcessAsync(TagHelperContext context, TagHelperOutput output)
+        {
+            SetPlaceholderForNameIfNotProvided();
+            
+            var tabHeader = GetTabHeaderItem(context, output);
+
+            var tabHeaderItems = GetValueFromContext<List<TabItem>>(context, TabItems);
+
+            tabHeaderItems.Add(new TabItem(tabHeader, "", false, TagHelper.Name, TagHelper.ParentDropdownName, false));
+
+            output.SuppressOutput();
+        }
+
+        protected virtual string GetTabHeaderItem(TagHelperContext context, TagHelperOutput output)
+        {
+            var id = TagHelper.Name + "-tab";
+            var href = TagHelper.Href;
+            var title = TagHelper.Title;
+
+            if (!string.IsNullOrWhiteSpace(TagHelper.ParentDropdownName))
+            {
+                return "<a class=\"dropdown-item\" id=\"" + id + "\" href=\"" + href + "\">" + title + "</a>";
+            }
+
+            return "<li class=\"nav-item\"><a class=\"nav-link" + AbpTabItemActivePlaceholder + "\" id=\"" + id + "\" href=\"" + href + "\">" +
+                   title +
+                   "</a></li>";
+        }
+
+        protected virtual void SetPlaceholderForNameIfNotProvided()
+        {
+            if (string.IsNullOrWhiteSpace(TagHelper.Name))
+            {
+                TagHelper.Name = TabItemNamePlaceHolder;
+            }
+        }
+    }
+}

framework/test/Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo/Pages/Components/Tabs.cshtml

@@ -22,6 +22,7 @@
             <abp-tab title="Home">
                 Content_Home
             </abp-tab>
+            <abp-tab-link title="Link" name="LinkId" href="#"/>
             <abp-tab title="profile">
                 Content_Profile
             </abp-tab>
@@ -38,10 +39,11 @@
     <div class="code-area">
         <pre>
 &lt;abp-tabs name=&quot;TabId&quot;&gt;
-    &lt;abp-tab name=&quot;nav-home&quot; title=&quot;Home&quot;&gt;
+    &lt;abp-tab title=&quot;Home&quot;&gt;
         Content_Home
     &lt;/abp-tab&gt;   
-    &lt;abp-tab name=&quot;nav-profile&quot; title=&quot;profile&quot;&gt;
+    &lt;abp-tab-link title=&quot;Link&quot; name=&quot;LinkId&quot; href=&quot;#&quot;/&gt;
+    &lt;abp-tab title=&quot;profile&quot;&gt;
         Content_Profile
     &lt;/abp-tab&gt;
     &lt;abp-tab-dropdown title=&quot;Contact&quot; name=&quot;ContactDropdown&quot;&gt;
@@ -108,14 +110,14 @@
     </div>
     <div class="code-area">
         <pre>
-&lt;abp-tabs name=&quot;TabId&quot;   tab-style=&quot;Pill&quot; &gt;
-    &lt;abp-tab name=&quot;nav-home&quot; active=&quot;true&quot; title=&quot;Home&quot;&gt;
+&lt;abp-tabs tab-style=&quot;Pill&quot; &gt;
+    &lt;abp-tab active=&quot;true&quot; title=&quot;Home&quot;&gt;
         Content_Home
     &lt;/abp-tab&gt;   
-    &lt;abp-tab name=&quot;nav-profile&quot; title=&quot;profile&quot;&gt;
+    &lt;abp-tab title=&quot;profile&quot;&gt;
         Content_Profile
     &lt;/abp-tab&gt;
-    &lt;abp-tab name=&quot;nav-contact&quot; title=&quot;Contact&quot;&gt;
+    &lt;abp-tab title=&quot;Contact&quot;&gt;
         Content_Contact
     &lt;/abp-tab&gt;
 &lt;/abp-tabs&gt;
@@ -142,13 +144,13 @@
     <div class="code-area">
         <pre>
 &lt;abp-tabs name=&quot;TabId&quot;  tab-style=&quot;Pill&quot; vertical-header-size=&quot;_2&quot; &gt;
-    &lt;abp-tab name=&quot;nav-home&quot; active=&quot;true&quot; title=&quot;Home&quot;&gt;
+    &lt;abp-tab active=&quot;true&quot; title=&quot;Home&quot;&gt;
         Content_Home
     &lt;/abp-tab&gt;   
-    &lt;abp-tab name=&quot;nav-profile&quot; title=&quot;profile&quot;&gt;
+    &lt;abp-tab title=&quot;profile&quot;&gt;
         Content_Profile
     &lt;/abp-tab&gt;
-    &lt;abp-tab name=&quot;nav-contact&quot; title=&quot;Contact&quot;&gt;
+    &lt;abp-tab title=&quot;Contact&quot;&gt;
         Content_Contact
     &lt;/abp-tab&gt;
 &lt;/abp-tabs&gt;