microservice demo: web layer

samples/MicroserviceDemo/modules/product/src/ProductManagement.Web/Localization/Resources/ProductManagement/en.json

@@ -2,6 +2,14 @@
   "culture": "en",
   "texts": {
     "Menu:ProductManagement": "Product Management",
-    "Menu:Products": "Products"
+    "Menu:Products": "Products",
+    "ProductManagement": "Product Management",
+    "CreateANewProduct": "Create A New Product",
+    "Products": "Products",
+    "StockCount": "Stock Count",
+    "Code": "Code",
+    "Name": "Name",
+    "Price": "Price",
+    "ProductDeletionWarningMessage": "Are you sure you want to delete this product?"
   }
 }

samples/MicroserviceDemo/modules/product/src/ProductManagement.Web/Pages/ProductManagement/ProductManagementPage.cs

@@ -0,0 +1,25 @@
+using Microsoft.AspNetCore.Mvc.Localization;
+using Microsoft.AspNetCore.Mvc.Razor.Internal;
+using ProductManagement.Localization;
+using Volo.Abp.AspNetCore.Mvc.UI.RazorPages;
+
+namespace ProductManagement.Pages.ProductManagement
+{
+    public abstract class ProductManagementPage : AbpPage
+    {
+        [RazorInject]
+        public IHtmlLocalizer<ProductManagementResource> L { get; set; }
+
+        public const string DefaultTitle = "ProductManagement";
+
+        public string GetTitle(string title = null)
+        {
+            if (string.IsNullOrWhiteSpace(title))
+            {
+                return DefaultTitle;
+            }
+
+            return title;
+        }
+    }
+}

samples/MicroserviceDemo/modules/product/src/ProductManagement.Web/Pages/ProductManagement/Products/Create.cshtml

@@ -0,0 +1,19 @@
+@page
+@using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Modal
+@inherits ProductManagement.Pages.ProductManagement.ProductManagementPage
+@model ProductManagement.Pages.ProductManagement.Products.CreateModel
+@{
+    Layout = null;
+}
+
+
+<abp-dynamic-form submit-button="false" abp-model="Product" asp-page="/ProductManagement/Products/Create">
+    <abp-modal size="@(AbpModalSize.Large)">
+        <abp-modal-header title="@L["Create"].Value"></abp-modal-header>
+        <abp-modal-body>
+            <abp-form-content />
+        </abp-modal-body>
+        <abp-modal-footer buttons="@(AbpModalButtons.Cancel|AbpModalButtons.Save)">
+        </abp-modal-footer>
+    </abp-modal>
+</abp-dynamic-form>

samples/MicroserviceDemo/modules/product/src/ProductManagement.Web/Pages/ProductManagement/Products/Create.cshtml.cs

@@ -0,0 +1,49 @@
+using System.ComponentModel.DataAnnotations;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Mvc;
+using Volo.Abp.AspNetCore.Mvc.UI.RazorPages;
+
+namespace ProductManagement.Pages.ProductManagement.Products
+{
+    public class CreateModel : AbpPageModel
+    {
+        private readonly IProductAppService _productAppService;
+
+        [BindProperty]
+        public ProductCreateModalView Product { get; set; } = new ProductCreateModalView();
+
+        public CreateModel(IProductAppService productAppService)
+        {
+            _productAppService = productAppService;
+        }
+
+        public void OnGet()
+        {
+
+        }
+
+        public async Task<IActionResult> OnPostAsync()
+        {
+            var createProductDto = ObjectMapper.Map<ProductCreateModalView, CreateProductDto>(Product);
+
+            await _productAppService.CreateAsync(createProductDto);
+
+            return NoContent();
+        }
+
+        public class ProductCreateModalView
+        {
+            [Required]
+            [StringLength(ProductConsts.MaxCodeLength)]
+            public string Code { get; set; }
+
+            [Required]
+            [StringLength(ProductConsts.MaxNameLength)]
+            public string Name { get; set; }
+
+            public float Price { get; set; }
+
+            public int StockCount { get; set; }
+        }
+    }
+}

samples/MicroserviceDemo/modules/product/src/ProductManagement.Web/Pages/ProductManagement/Products/Edit.cshtml

@@ -0,0 +1,18 @@
+@page
+@using Volo.Abp.AspNetCore.Mvc.UI.Bootstrap.TagHelpers.Modal
+@inherits ProductManagement.Pages.ProductManagement.ProductManagementPage
+@model ProductManagement.Pages.ProductManagement.Products.EditModel
+@{
+    Layout = null;
+}
+
+<abp-dynamic-form submit-button="false" abp-model="Product" asp-page="/ProductManagement/Products/Edit">
+    <abp-modal size="@(AbpModalSize.Large)">
+        <abp-modal-header title="@L["Edit"].Value"></abp-modal-header>
+        <abp-modal-body>
+            <abp-form-content />
+        </abp-modal-body>
+        <abp-modal-footer buttons="@(AbpModalButtons.Cancel|AbpModalButtons.Save)">
+        </abp-modal-footer>
+    </abp-modal>
+</abp-dynamic-form>

samples/MicroserviceDemo/modules/product/src/ProductManagement.Web/Pages/ProductManagement/Products/Edit.cshtml.cs

@@ -0,0 +1,67 @@
+using System;
+using System.Collections.Generic;
+using System.ComponentModel.DataAnnotations;
+using System.Linq;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.AspNetCore.Mvc.RazorPages;
+using Volo.Abp.AspNetCore.Mvc.UI.RazorPages;
+
+namespace ProductManagement.Pages.ProductManagement.Products
+{
+    public class EditModel : AbpPageModel
+    {
+        private readonly IProductAppService _productAppService;
+
+        [BindProperty]
+        public ProductEditModalView Product { get; set; } = new ProductEditModalView();
+
+        public EditModel(IProductAppService productAppService)
+        {
+            _productAppService = productAppService;
+        }
+
+        public void OnGet()
+        {
+        }
+
+        public async Task<ActionResult> OnGetAsync(Guid productId)
+        {
+            var productDto = await _productAppService.GetAsync(productId);
+
+            Product = ObjectMapper.Map<ProductDto, ProductEditModalView>(productDto);
+
+            return Page();
+        }
+
+        public async Task OnPostAsync()
+        {
+            await _productAppService.UpdateAsync(Product.Id, new UpdateProductDto()
+            {
+                Code = Product.Code,
+                Name = Product.Name,
+                Price = Product.Price,
+                StockCount = Product.StockCount
+            });
+        }
+
+        public class ProductEditModalView
+        {
+            [HiddenInput]
+            [Required]
+            public Guid Id { get; set; }
+
+            [Required]
+            [StringLength(ProductConsts.MaxCodeLength)]
+            public string Code { get; set; }
+
+            [Required]
+            [StringLength(ProductConsts.MaxNameLength)]
+            public string Name { get; set; }
+
+            public float Price { get; set; }
+
+            public int StockCount { get; set; }
+        }
+    }
+}

samples/MicroserviceDemo/modules/product/src/ProductManagement.Web/Pages/ProductManagement/Products/Index.cshtml

@@ -0,0 +1,42 @@
+@page
+@using Microsoft.AspNetCore.Authorization
+@using ProductManagement
+@inherits ProductManagement.Pages.ProductManagement.ProductManagementPage
+@model ProductManagement.Pages.ProductManagement.Products.IndexModel
+@inject IAuthorizationService Authorization
+@{
+    ViewBag.PageTitle = "Products";
+}
+
+@section scripts {
+    <abp-script src="/Pages/ProductManagement/Products/index.js" />
+}
+
+<abp-card>
+    <abp-card-header>
+        <abp-row>
+            <abp-column size-md="_6">
+                <h2>@L["Products"]</h2>
+            </abp-column>
+            <abp-column size-md="_6" class="text-right">
+                @if (await Authorization.IsGrantedAsync(ProductManagementPermissions.Products.Create))
+                {
+                    <abp-button icon="plus" text="@L["CreateANewProduct"].Value" button-type="Primary" id="CreateNewProductButtonId"></abp-button>
+                }
+            </abp-column>
+        </abp-row>
+    </abp-card-header>
+    <abp-card-body>
+        <abp-table striped-rows="true" id="ProductsTable" class="nowrap">
+            <thead>
+                <tr>
+                    <th>@L["Actions"]</th>
+                    <th>@L["Code"]</th>
+                    <th>@L["Name"]</th>
+                    <th>@L["Price"]</th>
+                    <th>@L["StockCount"]</th>
+                </tr>
+            </thead>
+        </abp-table>
+    </abp-card-body>
+</abp-card>

samples/MicroserviceDemo/modules/product/src/ProductManagement.Web/Pages/ProductManagement/Products/Index.cshtml.cs

@@ -0,0 +1,12 @@
+using System.Threading.Tasks;
+using Volo.Abp.AspNetCore.Mvc.UI.RazorPages;
+
+namespace ProductManagement.Pages.ProductManagement.Products
+{
+    public class IndexModel : AbpPageModel
+    {
+        public async Task OnGetAsync()
+        {
+        }
+    }
+}

samples/MicroserviceDemo/modules/product/src/ProductManagement.Web/Pages/ProductManagement/Products/index.js

@@ -0,0 +1,81 @@
+$(function () {
+
+    var l = abp.localization.getResource('ProductManagement');
+    var _createModal = new abp.ModalManager(abp.appPath + 'ProductManagement/Products/Create');
+    var _editModal = new abp.ModalManager(abp.appPath + 'ProductManagement/Products/Edit');
+
+    var _dataTable = $('#ProductsTable').DataTable(abp.libs.datatables.normalizeConfiguration({
+        processing: true,
+        serverSide: true,
+        paging: true,
+        searching: false,
+        autoWidth: false,
+        scrollCollapse: true,
+        order: [[1, "desc"]],
+        ajax: abp.libs.datatables.createAjax(productManagement.products.getListPaged),
+        columnDefs: [
+            {
+                rowAction: {
+                    items:
+                        [
+                            {
+                                text: l('Edit'),
+                                visible: function () {
+                                    return true; //TODO: Check permission
+                                },
+                                action: function (data) {
+                                    _editModal.open({
+                                        productId: data.record.id
+                                    });
+                                }
+                            },
+                            {
+                                text: l('Delete'),
+                                visible: function () {
+                                    return true; //TODO: Check permission
+                                },
+                                confirmMessage: function (data) { return l('ProductDeletionWarningMessage'); },
+                                action: function (data) {
+                                    productManagement.products
+                                        .delete(data.record.id)
+                                        .then(function () {
+                                            _dataTable.ajax.reload();
+                                        });
+                                }
+                            }
+                        ]
+                }
+            },
+            {
+                target: 1,
+                data: "code"
+            },
+            {
+                target: 2,
+                data: "name"
+            },
+            {
+                target: 3,
+                data: "price"
+            },
+            {
+                target: 4,
+                data: "stockCount"
+            }
+        ]
+    }));
+
+
+    $("#CreateNewProductButtonId").click(function () {
+        _createModal.open();
+    });
+
+    _createModal.onClose(function () {
+        _dataTable.ajax.reload();
+    });
+
+    _editModal.onResult(function () {
+        _dataTable.ajax.reload();
+    });
+
+});

samples/MicroserviceDemo/modules/product/src/ProductManagement.Web/ProductManagementWebAutoMapperProfile.cs

@@ -1,4 +1,5 @@
 using AutoMapper;
+using ProductManagement.Pages.ProductManagement.Products;
 
 namespace ProductManagement
 {
@@ -6,7 +7,8 @@ namespace ProductManagement
     {
         public ProductManagementWebAutoMapperProfile()
         {
-            //Create mappings.
+            CreateMap<CreateModel.ProductCreateModalView, CreateProductDto>();
+            CreateMap<ProductDto, EditModel.ProductEditModalView>();
         }
     }
 }