[回馈]ASP.NET Core MVC开发实战之商城系统(二)

经过一段时间的准备，新的一期【ASP.NET Core MVC开发实战之商城系统】已经开始，在之前的文章中，讲解了商城系统的整体功能设计，页面布局设计，环境搭建，系统配置，及首页商品类型，banner条，友情链接等功能的开发，今天继续讲解首页的降价促销，新品爆款等内容，仅供学习分享使用，如有不足之处，还请指正。

开发工具及技术

在本商城系统实例中，主要用到的开发工具和技术，如下所示：

• 开发工具，Visual Studio 2022 
• 数据库，SQL Server Management Studio 2012
• 开发框架，基于.Net 6.0的ASP.NET Core MVC
• 前端框架，基于项目自带的bootstrap，jQuery等前端库。

页面布局

根据前一篇文章的讲解，在首页除了商品类型，banner条，友情链接外，还有降价促销，新品爆款两个部分，为首页产品展示的核心，具体布局如下所示：

数据表设计

首先设计产品表Product，主要用于存储产品的详细信息，包括产品名称，价格，店铺ID等内容，具体如下所示：

建表语句，如下所示：

CREATE TABLE [dbo].[EB_Product](
	[Id] [bigint] IDENTITY(1,1) NOT NULL,
	[ShopId] [bigint] NULL,
	[Name] [varchar](100) NULL,
	[CategoryId] [bigint] NULL,
	[SubCategoryId] [bigint] NULL,
	[Price] [money] NULL,
	[Preferential] [numeric](18, 4) NULL,
	[PreferentialPrice] [money] NULL,
	[Description] [text] NULL,
	[Brand] [varchar](50) NULL,
	[BasicStyle] [varchar](50) NULL,
	[ProductStyle] [varchar](50) NULL,
	[Year] [varchar](50) NULL,
	[Season] [varchar](50) NULL,
	[Scenario] [varchar](50) NULL,
	[ImageUrl] [varchar](500) NULL,
	[CreateTime] [datetime] NULL,
	[CreateUser] [varchar](50) NULL,
	[LastEditTime] [datetime] NULL,
	[LastEditUser] [varchar](50) NULL
) ON [PRIMARY] TEXTIMAGE_ON [PRIMARY]

 

商品实体创建

产品表对应的项目模型实体，和数据表一一对应，如下所示：

using SqlSugar;
 
namespace EasyBuyShop.Models
{
    [SugarTable("EB_Product")]
    public class Product : EntityModel
    {
        /// 

        /// 店铺ID
        /// 
        public long ShopId { get; set; }
 
        /// 

        /// 产品名称
        /// 
        public string Name { get; set; }
 
        /// 

        /// 大类ID
        /// 
        public long CategoryId { get; set; }
 
        /// 

        /// 小类ID
        /// 
        public long SubCategoryId { get; set; }
 
        /// 

        /// 价格
        /// 
        public decimal Price { get; set; }
 
        /// 

        /// 打折后价格
        /// 
        public decimal PreferentialPrice { get; set; }
 
        /// 

        /// 品牌
        /// 
        public string Brand { get; set; }
 
        /// 

        /// 折扣
        /// 
        public decimal Preferential { get; set; }
        public string Description { get; set; }
 
        /// 

        /// 基础风格
        /// 
        public string BasicStyle { get; set; }
 
        /// 

        /// 产品风格
        /// 
        public string ProductStyle { get; set; }
 
        /// 

        /// 年份
        /// 
        public string Year { get; set; }
 
        /// 

        /// 季节
        /// 
        public string Season { get; set; }
 
        /// 

        /// 主要场景
        /// 
        public string Scenario { get; set; }
 
        /// 

        /// 主图片Url
        /// 
        public string ImageUrl { get; set; }
    }
}

 

数据处理层DAL

数据处理层用于和数据库进行交互，本次主要用于获取折扣Top3，和新品Top100这两种条件的的商品列表，如下所示：

using EasyBuyShop.Models;
using EasyBuyShop.Utils;
 
namespace EasyBuyShop.DAL
{
    public class ProductDal:BaseDal
    {
        /// 

        /// 新品前100
        /// 
        /// 
        public List GetTopNew100()
        {
            try
            {
                using (var db = this.GetDb(BaseDal.ConnStr))
                {
                    return db.Queryable().OrderByDescending(r => r.Id).Take(100).ToList();
                }
            }
            catch (Exception ex)
            {
                LogHelper.Fatal(ex.Message);
                return new List();
            }
        }
 
        /// 

        /// 折扣Top3
        /// 
        /// 
        public List GetTopDisCount3()
        {
            try
            {
                using (var db = this.GetDb(BaseDal.ConnStr))
                {
                    return db.Queryable().OrderByDescending(r => r.Preferential).Take(3).ToList();
                }
            }
            catch (Exception ex)
            {
                LogHelper.Fatal(ex.Message);
                return new List();
            }
        }
    }
}

 

注意：上述功能采用SqlSugar自带的方法实现，会根据Lamada表达式生成对应的SQL语句，可减少手写SQL的繁琐。

控制器获取

因为降价促销和新品爆款，也是首页的一部分，所以需要在首页控制器HomeController中，获取对应商品，传递到视图层，如下所示：

using EasyBuyShop.DAL;
using EasyBuyShop.Models;
using Microsoft.AspNetCore.Mvc;
using System.Diagnostics;
 
namespace EasyBuyShop.Controllers
{
    public class HomeController : Controller
    {
        private readonly ILogger logger;
 
        public HomeController(ILogger logger)
        {
            this.logger = logger;
        }
 
        public IActionResult Index()
        {
            CategoryDal categoryDal = new CategoryDal();
            SubCategoryDal subCategoryDal = new SubCategoryDal();
            ProductDal productDal = new ProductDal();
            var categories = categoryDal.GetCategories();
            var subCategories = subCategoryDal.GetSubCategories();
            var topNew100Product = productDal.GetTopNew100();
            var topDiscount3Product = productDal.GetTopDisCount3();
            ViewData["Categories"] = categories;
            ViewData["SubCategories"] = subCategories;
            ViewData["TopNew100"] = topNew100Product;
            ViewData["TopDiscount3"] = topDiscount3Product;
            var username = HttpContext.Session.GetString("username");
            var realName = HttpContext.Session.GetString("realname");
            ViewBag.Username = username;
            ViewBag.RealName = realName;
            return View();
        }
    }
}

 

注意：控制器方法中，往视图层传递数据采用ViewData和ViewBag实现，也可采用其他方式实现。具体ViewData和ViewBag传递数据之间的差异，可参考之前写的相关文章。

视图层展示

在Views/Home/Index.cshtml视图页面中，降价促销为一行三列，展示降价Top3的商品，具体如下所示：

	

		

			@foreach (var topDiscount in ViewData["TopDiscount3"] as List)
			{
				

					

						
						

							
@topDiscount.Brand
							
降价 @(Math.Round( topDiscount.Preferential*100,0))% 销售
							购买

						
					
					

						
@topDiscount.Name
					
				
			}
		
	

 

新品爆款为一行四列，展示新品信息，源码如下所示：

	

		

			
新品爆款 
		
		

			

				@foreach (var topNewProduct in ViewData["TopNew100"] as List)
				{
					

						

							

								
								

									
										
									
								
								

									新品
								
								

									
										
										添加购物车
									
									
										
										立即购买
									
								
							
							

								

									

										
@topNewProduct.Name
									
									
										[email protected]
									
								
								

									@(topNewProduct.BasicStyle) | @(topNewProduct.ProductStyle)
								
							
						
					
				}
			
		
	

 

注意：其中视图层代码，采用Razor表达式for循环，展示列表中的内容。关于Razor表达式的使用可参考其他文章。

页面展示

降价促销功能，运行如下所示：

新品爆款功能，运行如下所示：

以上就是ASP.NET Core MVC开发实战之商城系统第二部分内容，后续将继续介绍其他模块，敬请期待。