Merge branch 'dev' of https://github.com/abpframework/abp into dev

7 years ago · e7700262d3
6 changed files with 276 additions and 6 deletions
--- a/docs/en/UI/AspNetCore/Tag-Helpers/Dropdowns.md
+++ b/docs/en/UI/AspNetCore/Tag-Helpers/Dropdowns.md
@ -0,0 +1,97 @@
+# Dropdowns
+
+## Introduction
+
+`abp-dropdown` is the main container for dropdown content. 
+
+Basic usage:
+
+````xml
+<abp-dropdown>
+    <abp-dropdown-button text="Dropdown button" />
+    <abp-dropdown-menu>
+        <abp-dropdown-item href="#">Action</abp-dropdown-item>
+        <abp-dropdown-item href="#">Another action</abp-dropdown-item>
+        <abp-dropdown-item href="#">Something else here</abp-dropdown-item>
+    </abp-dropdown-menu>
+</abp-dropdown>
+````
+
+
+
+## Demo
+
+See the [dropdown demo page](https://bootstrap-taghelpers.abp.io/Components/Dropdowns) to see it in action.
+
+## Attributes
+
+### direction
+
+A value indicates which direction the dropdown buttons will be displayed to. Should be one of the following values:
+
+* `Down` (default value)
+* `Up`
+* `Right`
+* `Left`
+
+### dropdown-style
+
+A value indicates if an `abp-dropdown-button` will have split icon for dropdown. Should be one of the following values:
+
+* `Single` (default value)
+* `Split`
+
+
+
+## Menu items
+
+`abp-dropdown-menu` is the main container for dropdown menu items. 
+
+Basic usage:
+
+````xml
+<abp-dropdown>
+    <abp-dropdown-button button-type="Secondary" text="Dropdown"/>
+    <abp-dropdown-menu>
+        <abp-dropdown-header>Dropdown Header</abp-dropdown-header>
+        <abp-dropdown-item href="#">Action</abp-dropdown-item>
+        <abp-dropdown-item active="true" href="#">Active action</abp-dropdown-item>
+        <abp-dropdown-item disabled="true" href="#">Disabled action</abp-dropdown-item>
+        <abp-dropdown-divider/>
+        <abp-dropdown-item-text>Dropdown Item Text</abp-dropdown-item-text>
+        <abp-dropdown-item href="#">Something else here</abp-dropdown-item>
+    </abp-dropdown-menu>
+</abp-dropdown>
+````
+
+## Attributes
+
+### align
+
+A value indicates which direction `abp-dropdown-menu` items will be aligned to. Should be one of the following values:
+
+* `Left` (default value)
+* `Right`
+
+### Additional content
+
+`abp-dropdown-menu` can also contain additional HTML elements like headings, paragraphs, dividers or form element.
+
+Example:
+
+````xml
+<abp-dropdown >
+    <abp-dropdown-button button-type="Secondary" text="Dropdown With Form"/>
+    <abp-dropdown-menu>
+        <form class="px-4 py-3">
+            <abp-input asp-for="EmailAddress"></abp-input>
+            <abp-input asp-for="Password"></abp-input>
+            <abp-input asp-for="RememberMe"></abp-input>
+            <abp-button button-type="Primary" text="Sign In" type="submit" />
+        </form>
+        <abp-dropdown-divider></abp-dropdown-divider>
+        <abp-dropdown-item href="#">New around here? Sign up</abp-dropdown-item>
+        <abp-dropdown-item href="#">Forgot password?</abp-dropdown-item>
+    </abp-dropdown-menu>
+</abp-dropdown>
+````
--- a/docs/en/UI/AspNetCore/Tag-Helpers/Index.md
+++ b/docs/en/UI/AspNetCore/Tag-Helpers/Index.md
@ -15,6 +15,16 @@ Here, the list of components those are wrapped by the ABP Framework:
 * [Buttons](Buttons.md)
 * [Cards](Cards.md)
 * [Alerts](Alerts.md)
+* [Tabs](Tabs.md)
+* [Grids](Grids.md)
+* [Modals](Modals.md)
+* [Collapse](Collapse.md)
+* [Dropdowns](Dropdowns.md)
+* [List Groups](List-Groups.md)
+* [Paginator](Paginator.md)
+* [Popovers](Popovers.md)
+* [Progress Bars](Progress-Bars.md)
+* [Tooltips](Tooltips.md)
 * ...

 > Until all the tag helpers are documented, you can visit https://bootstrap-taghelpers.abp.io/ to see them with live samples.
--- a/docs/en/UI/AspNetCore/Tag-Helpers/Paginator.md
+++ b/docs/en/UI/AspNetCore/Tag-Helpers/Paginator.md
@ -0,0 +1,57 @@
+# Paginator
+
+## Introduction
+
+`abp-paginator` is the abp tag for pagination. Requires `Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Pagination.PagerModel` type of model.
+
+Basic usage:
+
+````xml
+<abp-paginator model="Model.PagerModel" show-info="true"></abp-paginator>
+````
+
+Model:
+
+````xml
+using Microsoft.AspNetCore.Mvc.RazorPages;
+using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Pagination;
+
+namespace Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.Demo.Pages.Components
+{
+    public class PaginatorModel : PageModel
+    {
+        public PagerModel PagerModel { get; set; }
+
+        public void OnGet(int currentPage, string sort)
+        {
+            PagerModel = new PagerModel(100, 10, currentPage, 10, "Paginator", sort);
+        }
+    }
+}
+````
+
+
+
+## Demo
+
+See the [paginator demo page](https://bootstrap-taghelpers.abp.io/Components/Paginator) to see it in action.
+
+## Attributes
+
+### model
+
+`Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Pagination.PagerModel` type of model can be initialized with the following data:
+
+* `totalCount`
+* `shownItemsCount`
+* `currentPage`
+* `pageSize`
+* `pageUrl`
+* `sort` (default null)
+
+### show-info
+
+A value indicates if an extra information about start, end and total records will be displayed. Should be one of the following values:
+
+* `false` (default value)
+* `true`
--- a/docs/en/UI/AspNetCore/Tag-Helpers/Progress-Bars.md
+++ b/docs/en/UI/AspNetCore/Tag-Helpers/Progress-Bars.md
@ -0,0 +1,70 @@
+# Progress Bars
+
+## Introduction
+
+`abp-progress-bar` is the abp tag for progress bar status.
+
+Basic usage:
+
+````xml
+<abp-progress-bar value="70" />
+
+<abp-progress-bar type="Warning" value="25"> %25 </abp-progress-bar>
+
+<abp-progress-bar type="Success" value="40" strip="true"/>
+
+<abp-progress-bar type="Dark" value="10" min-value="5" max-value="15" strip="true"> %50 </abp-progress-bar>
+
+<abp-progress-group>
+    <abp-progress-part type="Success" value="25"/>
+    <abp-progress-part type="Danger" value="10" strip="true"> %10 </abp-progress-part>
+    <abp-progress-part type="Primary" value="50" animation="true" strip="true" />
+</abp-progress-group>
+````
+
+
+
+## Demo
+
+See the [progress bars demo page](https://bootstrap-taghelpers.abp.io/Components/Progress-Bars) to see it in action.
+
+## Attributes
+
+### value
+
+A value indicates the current progress of the bar.
+
+### type
+
+A value indicates the background color of the progress bar. Should be one of the following values:
+
+* `Default` (default value)
+* `Secondary`
+* `Success`
+* `Danger`
+* `Warning`
+* `Info`
+* `Light`
+* `Dark`
+
+### min-value
+
+Minimum value of the progress bar. Default is 0.
+
+### max-value
+
+Maximum value of the progress bar. Default is 100.
+
+### strip
+
+A value indicates if the background style of the progress bar is stripped. Should be one of the following values:
+
+* `false` (default value)
+* `true`
+
+### animation
+
+A value indicates if the stripped background style of the progress bar is animated. Should be one of the following values:
+
+* `false` (default value)
+* `true`
--- a/docs/en/UI/AspNetCore/Tag-Helpers/Tooltips.md
+++ b/docs/en/UI/AspNetCore/Tag-Helpers/Tooltips.md
@ -0,0 +1,35 @@
+# Tooltips
+
+## Introduction
+
+`abp-tooltip` is the abp tag for tooltips.
+
+Basic usage:
+
+````xml
+<abp-button abp-tooltip="Tooltip">
+      Tooltip Default
+</abp-button>
+
+<abp-button abp-tooltip-top="Tooltip">
+      Tooltip on top
+</abp-button>
+
+<abp-button abp-tooltip-right="Tooltip">
+      Tooltip on right
+</abp-button>
+
+<abp-button abp-tooltip-bottom="Tooltip">
+      Tooltip on bottom
+</abp-button>
+
+<abp-button disabled="true" abp-tooltip="Tooltip">
+      Disabled button Tooltip
+</abp-button>
+````
+
+
+
+## Demo
+
+See the [tooltips demo page](https://bootstrap-taghelpers.abp.io/Components/Tooltips) to see it in action.
--- a/modules/docs/src/Volo.Docs.Web/Pages/Documents/Project/index.js
+++ b/modules/docs/src/Volo.Docs.Web/Pages/Documents/Project/index.js
@ -119,16 +119,17 @@
            };

            var setQueryString = function () {
-                clearQueryString();
-
-                var uri = window.location.href.toString();
-
                var comboboxes = $(".doc-section-combobox");
-
                if (comboboxes.length < 1) {
                    return;
                }

+                var hash = document.location.hash;
+
+                clearQueryString();
+
+                var uri = window.location.href.toString();
+
                var new_uri = uri + "?";

                for (var i = 0; i < comboboxes.length; i++) {
@ -142,7 +143,7 @@
                    }
                }

-                window.history.replaceState({}, document.title, new_uri);
+                window.history.replaceState({}, document.title, new_uri + hash);
            };

            var getTenYearsLater = function () {