diff --git a/docs/en/UI/Angular/Http-Requests.md b/docs/en/UI/Angular/Http-Requests.md new file mode 100644 index 0000000000..71878c8045 --- /dev/null +++ b/docs/en/UI/Angular/Http-Requests.md @@ -0,0 +1,209 @@ +# How to Make HTTP Requests + + + +## About HttpClient + +Angular has the amazing [HttpClient](https://angular.io/guide/http) for communication with backend services. It is a layer on top and a simplified representation of [XMLHttpRequest Web API](https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest). It also is the recommended agent by Angular for any HTTP request. There is nothing wrong with using the `HttpClient` in your ABP project. + +However, `HttpClient` leaves error handling to the caller (method). In other words, HTTP errors are handled manually and by hooking into the observer of the `Observable` returned. + +```js +getConfig() { + this.http.get(this.configUrl).subscribe( + config => this.updateConfig(config), + error => { + // Handle error here + }, + ); +} +``` + +Although clear and flexible, handling errors this way is repetitive work, even when error processing is delegated to the store or any other injectable. + +An `HttpInterceptor` is able to catch `HttpErrorResponse`  and can be used for a centralized error handling. Nevertheless, cases where default error handler, therefore the interceptor, must be disabled require additional work and comprehension of Angular internals. Check [this issue](https://github.com/angular/angular/issues/20203) for details. + + + +## RestService + +ABP core module has a utility service for HTTP requests: `RestService`. Unless explicitly configured otherwise, it catches HTTP errors and dispatches a `RestOccurError` action. This action is then captured by the `ErrorHandler` introduced by the `ThemeSharedModule`. Since you should already import this module in your app, when the `RestService` is used, all HTTP errors get automatically handled by deafult. + + + +### Getting Started with RestService + +In order to use the `RestService`, you must inject it in your class as a dependency. + +```js +import { RestService } from '@abp/ng.core'; + +@Injectable({ + /* class metadata here */ +}) +class DemoService { + constructor(private rest: RestService) {} +} +``` + +You do not have to provide the `RestService` at module or component/directive level, because it is already **provided in root**. + + + +### How to Make a Request with RestService + +You can use the `request` method of the `RestService` is for HTTP requests. Here is an example: + +```js +getFoo(id: number) { + const request: Rest.Request = { + method: 'GET', + url: '/api/some/path/to/foo/' + id, + }; + + return this.rest.request(request); +} +``` + + + +The `request` method always returns an `Observable`. Therefore you can do the following wherever you use `getFoo` method: + +```js +doSomethingWithFoo(id: number) { + this.demoService.getFoo(id).subscribe( + foo => { + // Do something with foo. + } + ) +} +``` + + + +**You do not have to worry about unsubscription.** The `RestService` uses `HttpClient` behind the scenes, so every observable it returns is a finite observable, i.e. it closes subscriptions automatically upon success or error. + + + +As you see, `request` method gets a request options object with `Rest.Request` type. This generic type expects the interface of the request body. You may pass `null` when there is no body, like in a `GET` or a `DELETE` request. Here is an example where there is one: + +```js +postFoo(body: Foo) { + const request: Rest.Request = { + method: 'POST', + url: '/api/some/path/to/foo', + body + }; + + return this.rest.request(request); +} +``` + + + +You may [check here](https://github.com/abpframework/abp/blob/dev/npm/ng-packs/packages/core/src/lib/models/rest.ts#L23) for complete `Rest.Request` type, which has only a few chages compared to [HttpRequest](https://angular.io/api/common/http/HttpRequest) class in Angular. + + + +### How to Disable Default Error Handler of RestService + +The `request` method, used with defaults, always handles errors. Let's see how you can change that behavior and handle errors yourself: + +```js +deleteFoo(id: number) { + const request: Rest.Request = { + method: 'DELETE', + url: '/api/some/path/to/foo/' + id, + }; + + return this.rest.request(request, { skipHandleError: true }); +} +``` + + + +`skipHandleError` config option, when set to `true`, disables the error handler and the returned observable starts throwing an error that you can catch in your subscription. + +```js +removeFooFromList(id: number) { + this.demoService.deleteFoo(id).subscribe( + foo => { + // Do something with foo. + }, + error => { + // Do something with error. + } + ) +} +``` + + + +### How to Get a Specific API Endpoint From Application Config + +Another nice config option that `request` method receives is `apiName` (available as of v2.4), which can be used to get a specific module endpoint from application configuration. + + + +```js +putFoo(body: Foo, id: string) { + const request: Rest.Request = { + method: 'PUT', + url: '/' + id, + body + }; + + return this.rest.request(request, {apiName: 'foo'}); +} +``` + + + +`putFoo` above will request `https://localhost:44305/api/some/path/to/foo/{id}` as long as the environment variables are as follows: + +```js +// environment.ts + +export const environment = { + apis: { + default: { + url: 'https://localhost:44305', + }, + foo: { + url: 'https://localhost:44305/api/some/path/to/foo', + }, + }, + + /* rest of the environment variables here */ +} +``` + + + +### How to Observe Response Object or HTTP Events Instead of Body + +`RestService` assumes you are generally interested in the body of a response and, by default, sets `observe` property as `'body'`. However, there may be times you are rather interested in something else, such as a custom proprietary header. For that, the `request` method receives `observe` property in its config object. + +```js +getSomeCustomHeaderValue() { + const request: Rest.Request = { + method: 'GET', + url: '/api/some/path/that/sends/some-custom-header', + }; + + return this.rest.request>( + request, + {observe: Rest.Observe.Response}, + ).pipe( + map(response => response.headers.get('Some-Custom-Header')) + ); +} +``` + + + +You may find `Rest.Observe` enum [here](https://github.com/abpframework/abp/blob/dev/npm/ng-packs/packages/core/src/lib/models/rest.ts#L10). + +## What's Next? + +* [Localization](./Localization.md) \ No newline at end of file diff --git a/docs/en/UI/Angular/Localization.md b/docs/en/UI/Angular/Localization.md index 01394a3fea..d627f466ba 100644 --- a/docs/en/UI/Angular/Localization.md +++ b/docs/en/UI/Angular/Localization.md @@ -133,4 +133,8 @@ Localization resources are stored in the `localization` property of `ConfigState ## See Also -* [Localization in ASP.NET Core](../../Localization.md) \ No newline at end of file +* [Localization in ASP.NET Core](../../Localization.md) + +## What's Next? + +* [Permission Management](./Permission-Management.md) \ No newline at end of file diff --git a/docs/en/UI/AspNetCore/Tag-Helpers/Collapse.md b/docs/en/UI/AspNetCore/Tag-Helpers/Collapse.md new file mode 100644 index 0000000000..38fab4d44b --- /dev/null +++ b/docs/en/UI/AspNetCore/Tag-Helpers/Collapse.md @@ -0,0 +1,92 @@ +# Collapse + +## Introduction + +`abp-collapse-body` is the main container for showing and hiding content. `abp-collapse-id` is used to show and hide the content container. Can be triggered with both `abp-button` and `a` tags. + +Basic usage: + +````xml + + Link with href + + + Anim pariatur wolf moon tempor,,, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. + +```` + + + +## Demo + +See the [collapse demo page](https://bootstrap-taghelpers.abp.io/Components/Collapse) to see it in action. + +## Attributes + +### show + +A value indicates if the collapse body will be initialized visible or hidden. Should be one of the following values: + +* `false` (default value) +* `true` + +### multi + +A value indicates if an `abp-collapse-body` can be shown or hidden by an element that can show/hide multiple collapse bodies. Basically, this attribute adds "multi-collapse" class to `abp-collapse-body`. Should be one of the following values: + +* `false` (default value) +* `true` + +Sample: + +````xml + Toggle first element + + + + + + + Curabitur porta porttitor libero eu luctus. Praesent ultrices mattis commodo. Integer sodales massa risus, in molestie enim sagittis blandit + + + + + Anim pariatur wolf moon tempor,,, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. + + + +```` + +## Accordion example + +`abp-accordion` is the main container for the accordion items. + +Basic usage: + +````xml + + + Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry rtat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. + + + Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. + + + Anim pariatur wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. + + +```` + +## Attributes + +### active + +A value indicates if the accordion item will be initialized visible or hidden. Should be one of the following values: + +* `false` (default value) +* `true` + +### title + +A value indicates the visible title of the accordion item. Should be a string value. diff --git a/docs/en/UI/AspNetCore/Tag-Helpers/Dropdowns.md b/docs/en/UI/AspNetCore/Tag-Helpers/Dropdowns.md new file mode 100644 index 0000000000..1c062b5f73 --- /dev/null +++ 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 + + + + Action + Another action + Something else here + + +```` + + + +## 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 + + + + Dropdown Header + Action + Active action + Disabled action + + Dropdown Item Text + Something else here + + +```` + +## 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 + + + +
+ + + + + + + New around here? Sign up + Forgot password? +
+ +```` diff --git a/docs/en/UI/AspNetCore/Tag-Helpers/Index.md b/docs/en/UI/AspNetCore/Tag-Helpers/Index.md index 5f36395c00..a7aa0b65d2 100644 --- 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. diff --git a/docs/en/UI/AspNetCore/Tag-Helpers/Modals.md b/docs/en/UI/AspNetCore/Tag-Helpers/Modals.md new file mode 100644 index 0000000000..9cf1258373 --- /dev/null +++ b/docs/en/UI/AspNetCore/Tag-Helpers/Modals.md @@ -0,0 +1,81 @@ +# Modals + +## Introduction + +`abp-modal` is a main element to create a modal. + +Basic usage: + +````xml +Launch modal + + + + + Woohoo, you're reading this text in a modal! + + + +```` + + + +## Demo + +See the [modals demo page](https://bootstrap-taghelpers.abp.io/Components/Modals) to see it in action. + +## Attributes + +### centered + +A value indicates the positioning of the modal. Should be one of the following values: + +* `false` (default value) +* `true` + +### size + +A value indicates the size of the modal. Should be one of the following values: + +* `Default` (default value) +* `Small` +* `Large` +* `ExtraLarge` + +### static + +A value indicates if the modal will be static. Should be one of the following values: + +* `false` (default value) +* `true` + +### Additional content + +`abp-modal-footer` can have multiple buttons with alignment option. + +Add `@using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Modal` to your page. + +Example: + +````xml +Launch modal + + + + + Woohoo, you're reading this text in a modal! + + + +```` + +### button-alignment + +A value indicates the positioning of your modal footer buttons. Should be one of the following values: + +* `Default` (default value) +* `Start` +* `Center` +* `Around` +* `Between` +* `End` \ No newline at end of file diff --git a/docs/en/UI/AspNetCore/Tag-Helpers/Paginator.md b/docs/en/UI/AspNetCore/Tag-Helpers/Paginator.md new file mode 100644 index 0000000000..0cc63d49e8 --- /dev/null +++ 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 + +```` + +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` diff --git a/docs/en/UI/AspNetCore/Tag-Helpers/Progress-Bars.md b/docs/en/UI/AspNetCore/Tag-Helpers/Progress-Bars.md new file mode 100644 index 0000000000..dc69f7e47e --- /dev/null +++ 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 + + + %25 + + + + %50 + + + + %10 + + +```` + + + +## 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` \ No newline at end of file diff --git a/docs/en/UI/AspNetCore/Tag-Helpers/Tooltips.md b/docs/en/UI/AspNetCore/Tag-Helpers/Tooltips.md new file mode 100644 index 0000000000..55b6e574e8 --- /dev/null +++ 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 + + Tooltip Default + + + + Tooltip on top + + + + Tooltip on right + + + + Tooltip on bottom + + + + Disabled button Tooltip + +```` + + + +## Demo + +See the [tooltips demo page](https://bootstrap-taghelpers.abp.io/Components/Tooltips) to see it in action. diff --git a/docs/en/docs-nav.json b/docs/en/docs-nav.json index 77eadf7f35..ad0fc525cf 100644 --- a/docs/en/docs-nav.json +++ b/docs/en/docs-nav.json @@ -316,6 +316,10 @@ "text": "Service Proxies", "path": "UI/Angular/Service-Proxies.md" }, + { + "text": "HTTP Requests", + "path": "UI/Angular/HTTP-Requests.md" + }, { "text": "Localization", "path": "UI/Angular/Localization.md" diff --git a/framework/src/Volo.Abp.Cli.Core/Volo/Abp/Cli/ProjectModification/NpmGlobalPackagesChecker.cs b/framework/src/Volo.Abp.Cli.Core/Volo/Abp/Cli/ProjectModification/NpmGlobalPackagesChecker.cs index 8140b73b64..59c262e065 100644 --- a/framework/src/Volo.Abp.Cli.Core/Volo/Abp/Cli/ProjectModification/NpmGlobalPackagesChecker.cs +++ b/framework/src/Volo.Abp.Cli.Core/Volo/Abp/Cli/ProjectModification/NpmGlobalPackagesChecker.cs @@ -9,7 +9,7 @@ namespace Volo.Abp.Cli.ProjectModification { public ILogger Logger { get; set; } - public NpmGlobalPackagesChecker(PackageJsonFileFinder packageJsonFileFinder) + public NpmGlobalPackagesChecker() { Logger = NullLogger.Instance; } diff --git a/modules/docs/src/Volo.Docs.Web/Pages/Documents/Project/index.js b/modules/docs/src/Volo.Docs.Web/Pages/Documents/Project/index.js index 8f53f1cf6e..1b3d5ac7c3 100644 --- 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 () { diff --git a/modules/tenant-management/src/Volo.Abp.TenantManagement.Web/Pages/TenantManagement/Tenants/CreateModal.cshtml.cs b/modules/tenant-management/src/Volo.Abp.TenantManagement.Web/Pages/TenantManagement/Tenants/CreateModal.cshtml.cs index 45e86e2985..098f7e1393 100644 --- a/modules/tenant-management/src/Volo.Abp.TenantManagement.Web/Pages/TenantManagement/Tenants/CreateModal.cshtml.cs +++ b/modules/tenant-management/src/Volo.Abp.TenantManagement.Web/Pages/TenantManagement/Tenants/CreateModal.cshtml.cs @@ -44,6 +44,7 @@ namespace Volo.Abp.TenantManagement.Web.Pages.TenantManagement.Tenants public string AdminEmailAddress { get; set; } [Required] + [DataType(DataType.Password)] [MaxLength(128)] public string AdminPassword { get; set; } } diff --git a/templates/app/aspnet-core/src/MyCompanyName.MyProjectName.Domain/Data/MyProjectNameDbMigrationService.cs b/templates/app/aspnet-core/src/MyCompanyName.MyProjectName.Domain/Data/MyProjectNameDbMigrationService.cs index bf0a315c93..6c09ffd233 100644 --- a/templates/app/aspnet-core/src/MyCompanyName.MyProjectName.Domain/Data/MyProjectNameDbMigrationService.cs +++ b/templates/app/aspnet-core/src/MyCompanyName.MyProjectName.Domain/Data/MyProjectNameDbMigrationService.cs @@ -1,4 +1,5 @@ using System.Collections.Generic; +using System.Linq; using System.Threading.Tasks; using Microsoft.Extensions.Logging; using Microsoft.Extensions.Logging.Abstractions; @@ -38,15 +39,14 @@ namespace MyCompanyName.MyProjectName.Data await MigrateHostDatabaseAsync(); + var tenants = await _tenantRepository.GetListAsync(includeDetails: true); + var i = 0; - var tenants = await _tenantRepository.GetListAsync(); - foreach (var tenant in tenants) + foreach (var tenant in tenants.Where(t => t.ConnectionStrings.Any())) { - i++; - using (_currentTenant.Change(tenant.Id)) { - Logger.LogInformation($"Migrating {tenant.Name} database schema... ({i} of {tenants.Count})"); + Logger.LogInformation($"Migrating {tenant.Name} database schema... ({++i} of {tenants.Count})"); await MigrateTenantDatabasesAsync(tenant); Logger.LogInformation($"Successfully completed {tenant.Name} database migrations."); }