深圳市深圳市住房和建设局网站首页,网站mp3播放器代码,网页美工技能培训,企业网站快速优化排名文章目录 项目地址三、Produtcts的CRUD3.1 Products列表的展示页面(Read)3.1.1 给Product的Model里添加Category的属性3.1.2 View视图里展示Product List3.2 增加Product数据(Add)3.2.1 创建ViewModel用来组合多个Model3.2.2 在_ViewImposts里引入ViewModels3.2.3 添加Add的… 文章目录 项目地址三、Produtcts的CRUD3.1 Products列表的展示页面(Read)3.1.1 给Product的Model里添加Category的属性3.1.2 View视图里展示Product List 3.2 增加Product数据(Add)3.2.1 创建ViewModel用来组合多个Model3.2.2 在_ViewImposts里引入ViewModels3.2.3 添加Add的Action逻辑3.2.4 添加Add的视图 3.3 编辑Product数据(Edit)3.3.1 创建Edit的Get请求的Action3.3.2 创建Edit的Post请求的Action 四、Cashier Console的实现4.1创建Cashier的Index页面4.1.1 创建ViewModel4.1.2 创建Index页面的商品类的Action4.1.3 创建Index的view视图页面 4.2 创建Cashier Index页面里的product展示4.2.1 product的controller里添加partial action用来分块展示商品1. 在ProductRepository里添加查询方法 4.2.2 在Product的视图里添加商品表格的视图4.2.3 将上面的Partial View整合到Index页面里1. 将jquery的脚本添加到Layout页面2. 在Sales的Index视图里,使用jq引入product的partial view 4.3 展示详细的商品信息4.3.1 点击商品Table实现行高亮1. 给需要高亮的地方,添加一个类名2. 静态文件里添加高亮样式3. 添加jq方法,显示高亮 4.3.2 高亮之后,显示商品的详情1.获取商品的id2. 添加显示商品详请功能 4.4 Sales Fom implement4.4.1 添加Sales Form的视图1. 修改SalesViewModel2. 创建form的视图3. 只有选择商品后才显示表单4. 自定义验证,验证输入数量是否大于库存 4.4.2 提交数量后,计算和出库并且展示最新信息1. 添加Transaction的Model2. 完善sell Action的功能3. 创建ViewComponent 项目地址
教程作者:教程地址:代码仓库地址:所用到的框架和插件:三、Produtcts的CRUD
创建Product的Model创建ProductRepository3.1 Products列表的展示页面(Read)
3.1.1 给Product的Model里添加Category的属性
修改ProductRepository.cs里的获取所有products的方法,根据是否有CategoryId来判断,查询出有Id的产品的Category类2. 修改,查询单个product的方法,同样根据是否有id,来查询
public static Product? GetProductById(int productId,bool loadCategory = false)
{var product = _products.FirstOrDefault(x = x.ProductId == productId);if (product != null){var prod = new Product{ProductId = product.ProductId,Name = product.Name,Quantity = product.Quantity,Price = product.Price,CategoryId = product.CategoryId};if (loadCategory product.CategoryId.HasValue){prod.Category = CategoriesRepository.GetCategoryById(product.CategoryId.Value);}}return null;
}3.1.2 View视图里展示Product List
前端通过Product.Category.Name就可以获取Category 的Name属性3.2 增加Product数据(Add)
在Add的页面里,我们需要展示所有Category的分类在下拉框里,所以这个页面里面需要两个类,分别是Product和Category3.2.1 创建ViewModel用来组合多个Model
根目录下创建一个ViewModel的文件夹,并且创建ProductCategoryViewModel.cs ,并且给出默认值;using WebApp.Models;namespace WebApp.ViewModels
{public class ProductCategoryViewModel{public ListCategory Categories { get; set; } = new ListCategory();public Product Product { get; set; } = new Product(); }
}3.2.2 在_ViewImposts里引入ViewModels
需要在_ViewImposts.cshtml里引入添加ViewModels,不然页面无法使用@using WebApp;
@using WebApp.Models;
@using WebApp.ViewModels;
@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers3.2.3 添加Add的Action逻辑
在ProductsController.cs 里添加逻辑Add的Get请求的Action Add的Post请求的Action3.2.4 添加Add的视图
引入ViewMoldes,该ViewModels,包含两个类Product和Category@model ProductCategoryViewModel添加下拉选项3.3 编辑Product数据(Edit)
3.3.1 创建Edit的Get请求的Action
Product的Index页面,将ProductId传递给edit 的actiona class="btn btn-warning col-3 d-inline" asp-controller="products" asp-action="edit" /asp-route-id="@product.ProductId"Edit/a创建Edit 的get请求的action3.3.2 创建Edit的Post请求的Action
需要注意的是:Update的传参需要①通过product.CategoryId.Value获取可空类型的值,如果该值是空,则报错;②传递一个[HttpPost]
public IActionResult Edit(ProductCategoryViewModel productCategoryViewModel)
{if (ModelState.IsValid){ProductsRepository.UpdateProduct(productCategoryViewModel.Product.ProductId, productCategoryViewModel.Product);return RedirectToAction("Index");}productCategoryViewModel.Categories = CategoriesRepository.GetCategories();return View(productCategoryViewModel);
}四、Cashier Console的实现
4.1创建Cashier的Index页面
4.1.1 创建ViewModel
在ViewModels文件夹下,创建SalesViewModel.cs,主要作用是,设置一个 用户传递选择的CategoryId和一个商品列表using WebApp.Models;namespace WebApp.ViewModels
{public class SalesViewModel{public int SelectedCategoryId { get; set; }public ListCategory Categories {