【从实作学习ASP.NET Core】Day25 | 前台 | 结帐流程

我们简单定义结帐流程为 [ 购物车 -> 输入订单资料 -> 建立订单 -> 付款 ]
昨天已经完成购物车了，今天就继续把输入订单资料和建立订单的部分完成

订单模型

建立订单模型，订单是要存进资料库的，所以是需要建立资料表的
还是老样子用 Add-Migration、Update-Database 移转资料库

public class Order
{
    public int Id { get; set; }
    public DateTime OrderDate { get; set; }        //订单建立时间
    
    public string UserId { get; set; }             //付款者ID
    public string UserName { get; set; }           //付款者帐号
    
    public string ReceiverName { get; set; }       //收货者姓名
    public string ReceiverAdress { get; set; }     //收货者地址
    public string ReceiverPhone { get; set; }      //收货者电话
    
    public int Total { get; set; }                 //订单总额
    public List<OrderItem> OrderItem { get; set; } //订单内容
    public bool isPaid { get; set; }               //付款状态
}

public class OrderItem
{
    public int Id { get; set; }
    public int OrderId { get; set; }
    public int ProductId { get; set; }
    public int Amount { get; set; }
    public int SubTotal { get; set; }
}

订单控制器

新建一个控制器 OrderController.cs 到 Controller 资料夹
并且加入[Authorize]将他设为验证状态，必须要登入才能进行结帐动作
这个控制器会需要三个主要 Action ：

Checkout()：填写订单资料
CreateOrder()：建立订单
ReviewOrder()：显示订单

配合对应的 [填写订单资料] 和 [显示订单] 两个页面

Checkout.cshtml
ReviewOrder.cshtml

填写订单资料

接收来自购物车的资料，加上订单栏位填写

public IActionResult Checkout()
{
    if (SessionHelper.GetObjectFromJson<List<OrderItem>>(HttpContext.Session, "cart") == null)
    {
        return RedirectToAction("Index", "Cart");
    }

    var myOrder = new Order()
    {
        UserId = _userManager.GetUserId(User),     //取得订购人ID
        UserName = _userManager.GetUserName(User), //取得订购人帐号
        OrderItem = SessionHelper.                 //取得购物车资料
            GetObjectFromJson<List<OrderItem>>(HttpContext.Session, "cart")
    };
    myOrder.Total = myOrder.OrderItem.Sum(m => m.SubTotal); //计算订单总额

    ViewBag.CartItems = SessionHelper.
        GetObjectFromJson<List<CartItem>>(HttpContext.Session, "cart");

    return View(myOrder);
}

前端可以直接用 Edit 模板下去改排版

点选建立订单按钮以後触发 CreateOrder() 把填写好的资料储存到资料库里

建立订单

[HttpPost]
public async Task<IActionResult> CreateOrder(Order order)
{
    if (ModelState.IsValid)
    {
        order.OrderDate = DateTime.Now;    //取得当前时间
        order.isPaid = false;              //付款状态预设为False
        order.OrderItem = SessionHelper.   //绑定订单内容
            GetObjectFromJson<List<OrderItem>>(HttpContext.Session, "cart");

        _context.Add(order);               //将订单写入资料库
        await _context.SaveChangesAsync();
        SessionHelper.Remove(HttpContext.Session, "cart");

        //完成後画面移转至ReviewOrder()
        return RedirectToAction("ReviewOrder", new {  Id = order.Id } );
    }
    return View("Checkout");
}

显示订单

public async Task<IActionResult> ReviewOrder(int? Id)
{
    if(Id == null)
    {
        return NotFound();
    }
    //从资料库取得订单资料
    var order = await _context.Order.FirstOrDefaultAsync(m => m.Id == Id);
    if(order.UserId != _userManager.GetUserId(User))
    {
        return NotFound();
    }
    else
    {
        //取得订单内容
        order.OrderItem = await _context.OrderItem 
            .Where(p => p.OrderId == Id).ToListAsync();
        ViewBag.orderItems = GetOrderItems(order.Id);
    }
    return View(order);
}

// 取得商品详细资料
private List<CartItem> GetOrderItems(int orderId)
{
    var OrderItems = _context.OrderItem.Where(p => p.OrderId == orderId).ToList();
    List<CartItem> orderItems = new List<CartItem>();
    foreach (var orderitem in OrderItems)
    {
        CartItem item = new CartItem(orderitem);
        item.Product = _context.Product.Single(x => x.Id == orderitem.ProductId);
        orderItems.Add(item);
    }
    return orderItems;
 }