当前位置: 首页 > news >正文

MVC基础——市场管理系统(二)


文章目录

  • 项目地址
  • 三、Produtcts的CRUD
    • 3.1 Products列表的展示页面(Read)
      • 3.1.1 给Product的Model里添加Category的属性
      • 3.1.2 View视图里展示Product List
    • 3.2 增加Product数据(Add)
      • 3.2.1 创建ViewModel用来组合多个Model
      • 3.2.2 在_ViewImposts里引入ViewModels
      • 3.2.3 添加Add的Action逻辑
      • 3.2.4 添加Add的视图
    • 3.3 编辑Product数据(Edit)
      • 3.3.1 创建Edit的Get请求的Action
      • 3.3.2 创建Edit的Post请求的Action
  • 四、Cashier Console的实现
    • 4.1创建Cashier的Index页面
      • 4.1.1 创建ViewModel
      • 4.1.2 创建Index页面的商品类的Action
      • 4.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.获取商品的id
        • 2. 添加显示商品详请功能
    • 4.4 Sales Fom implement
      • 4.4.1 添加Sales Form的视图
        • 1. 修改SalesViewModel
        • 2. 创建form的视图
        • 3. 只有选择商品后才显示表单
        • 4. 自定义验证,验证输入数量是否大于库存
      • 4.4.2 提交数量后,计算和出库并且展示最新信息
        • 1. 添加Transaction的Model
        • 2. 完善sell Action的功能
        • 3. 创建ViewComponent


项目地址

  • 教程作者:
  • 教程地址:
  • 代码仓库地址:
  • 所用到的框架和插件:

三、Produtcts的CRUD

  1. 创建Product的Model
  2. 创建ProductRepository

3.1 Products列表的展示页面(Read)

3.1.1 给Product的Model里添加Category的属性

  1. 修改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和Category

在这里插入图片描述

3.2.1 创建ViewModel用来组合多个Model

  • 根目录下创建一个ViewModel的文件夹,并且创建ProductCategoryViewModel.cs ,并且给出默认值;
using WebApp.Models;namespace WebApp.ViewModels
{public class ProductCategoryViewModel{public List<Category> Categories { get; set; } = new List<Category>();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.TagHelpers

3.2.3 添加Add的Action逻辑

  • ProductsController.cs 里添加逻辑
  1. Add的Get请求的Action
    在这里插入图片描述
  2. Add的Post请求的Action

在这里插入图片描述

3.2.4 添加Add的视图

  • 引入ViewMoldes,该ViewModels,包含两个类Product和Category
@model ProductCategoryViewModel
  • 添加下拉选项

在这里插入图片描述

3.3 编辑Product数据(Edit)

3.3.1 创建Edit的Get请求的Action

  1. Product的Index页面,将ProductId传递给edit 的action
 <a class="btn btn-warning col-3 d-inline" asp-controller="products" asp-action="edit" /asp-route-id="@product.ProductId">Edit</a>
  1. 创建Edit 的get请求的action

在这里插入图片描述

3.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 List<Category> Categories {

相关文章:

MVC基础——市场管理系统(二)

文章目录 项目地址三、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的…...

java------------常用API preiod duration 计算时间差

1&#xff0c;preiod 如果末天数比初天数小&#xff0c;需要进一位 package API;import java.time.LocalDate; import java.time.Period;public class preiod {public static void main(String[] args) {// 计算时间差// LocalDate获取对象其中的一个方法LocalDate d1 LocalD…...

使用 FAISS 进行高效相似性搜索:从文本检索到动态数据处理

在现代数据科学和人工智能应用中&#xff0c;处理大量高维数据并从中找到相似项是一个常见任务。无论是在推荐系统、搜索引擎&#xff0c;还是在自然语言处理应用中&#xff0c;如何高效地进行相似性搜索&#xff08;Similarity Search&#xff09;一直是一个挑战。为了解决这个…...

执行“go mod tidy”遇到“misbehavior”错误

执行“go mod tidy”报错下错误&#xff0c;执行“go clean -modcache”和删除“go env GOMODCACHE”指定目录均无效&#xff1a; SECURITY ERROR go.sum database server misbehavior detected!old database:go.sum database tree3397826xyyhzdyAOat5li/EXx/MK1gONQf3LAGqArh…...

深入详解人工智能机器学习:强化学习

目录 强化学习概述 强化学习的基本概念 定义 关键组件 强化学习过程 常用算法 应用示例 示例代码 代码解释 应用场景 强化学习核心概念和底层原理 核心概念 底层原理 总结 强化学习概述 强化学习&#xff08;Reinforcement Learning, RL&#xff09;是机器学习中的…...

力扣打卡11:合并区间(比较器内联,引用传参的优化)

链接&#xff1a;56. 合并区间 - 力扣&#xff08;LeetCode&#xff09; 这道题可以用贪心。 首先将intervals的left&#xff08;intervals[i][0]&#xff09;排序。 然后拿出第一个区间&#xff0c;比较后面相邻的区间&#xff1a; 当前right<后left&#xff0c;表示下一…...

《 bilibili-起步级 用户模块接口文档 经验分享 ~》

bilibili - 用户模块接口文档 - 经验分享 ~ 数据库er关系图 : 迅速跳转链接 枚举码实体类 : 迅速跳转链接 使用apifox.json格式导入接口文档 步骤 登录Apifox。新建文件, 将代码粘贴到该文件, 并更改后缀为 .apifox.json进入项目&#xff0c;点击“导入”。选择“Apifox”格式…...

AES 与 SM4 加密算法:深度解析与对比

&#x1f9d1; 博主简介&#xff1a;CSDN博客专家&#xff0c;历代文学网&#xff08;PC端可以访问&#xff1a;https://literature.sinhy.com/#/literature?__c1000&#xff0c;移动端可微信小程序搜索“历代文学”&#xff09;总架构师&#xff0c;15年工作经验&#xff0c;…...

启保停电路如何接到PLC

传感器&#xff1a;NPN :棕&#xff1a;正 蓝&#xff1a;负 黑&#xff1a;信号 1M——>24V PNP&#xff1a;1M——>0V...

HTTP multipart/form-data 请求

序言 最近在写项目的过程中有一个需求是利用 HTTP 协议传输图片和视频&#xff0c;经过查询方法相应的方法发现使用 multipart/form-data 的方式&#xff0c;这是最常见处理二进制文件的表单编码类型。  学习了一下午&#xff0c;现在总结一下使用的方法和相关的知识点&#x…...

配置服务器的免密登录

在服务器中配置别名和免密登录 如果没有生成过公钥和密钥 ssh-keygen然后就生成了公钥和密钥&#xff0c;下一步进入.ssh文件夹 cd .ssh/可以看到文件夹中会多出来三个文件 id_rsa&#xff1a;密钥id_rsa.pub&#xff1a;公钥known_hosts&#xff1a;A通过ssh首次连接到B&am…...

普通遥控电动遮阳雨棚怎么接入米家并用苹果手机Siri控制

环境&#xff1a; 遥控电动遮阳雨棚 无线射频拷贝器 米家APP 问题描述&#xff1a; 普通遥控电动遮阳雨棚怎么接入米家并用苹果手机Siri控制 解决方案&#xff1a; 1.先看看遥控器射频参数,有些在里面板子上&#xff0c;要拆开才能看到&#xff0c;我这是433的 2.到网店…...

两种不同简缩极化的六个方程

方程1 (3*A*(b - a*1i 1) - A*((c d*1i)*(f1 f2*1i)*1i - (c d*1i)^2))*(a - b*1i)*1i 3*A*(b - a*1i 1) 2*(A*(c f2 d*1i - f1*1i) A*(c d*1i - (a b*1i)*(c d*1i)*1i))*(c - d*1i) (A*(c f2 d*1i - f1*1i) A*(c d*1i - (a b*1i)*(c d*1i)*1i))*(f1 - f2…...

环形缓冲区(Ring Buffer):概念、功能、使用场景与实现

一、概念 环形缓冲区&#xff08;Ring Buffer&#xff09;&#xff0c;又称循环缓冲区&#xff0c;是一种用于数据缓冲的数据结构。其核心思想是将缓冲区视为一个环形结构&#xff0c;当数据写入到缓冲区的末尾时&#xff0c;会自动回绕到缓冲区的开头继续写入&#xff0c;形成…...

大连理工大学数据结构2003年硕士入学试题

大连理工大学2003年硕士入学试题 数据结构部分(共75分) 一、回答下列问题(20分) 1&#xff0e;循环队列用数组A[0&#xff0e;&#xff0e;m—1)存放其数据元素。设tail指向其实际的队尾&#xff0c;front指向其实际队首的前一个位置&#xff0c;则当前队列中的数据元素有多少个…...

Master EDI 项目需求分析

Master Electronics 通过其全球分销网络&#xff0c;支持多种采购需求&#xff0c;确保能够为客户提供可靠的元件供应链解决方案&#xff0c;同时为快速高效的与全球伙伴建立合作&#xff0c;Master 选择通过EDI来实现与交易伙伴间的数据传输。 EDI为交易伙伴之间建立了一个安…...

图海寻径——图相关算法的奇幻探索之旅

一、图的表示 1. 邻接矩阵 (Adjacency Matrix) #include <iostream> #include <vector> #include <queue> #include <limits>using namespace std;class GraphMatrix { private:int numVertices;vector<vector<int>> adjMatrix;const st…...

亚马逊云科技re:Invent:生成式AI与全球布局

作为全球云计算和人工智能领域一年一度的顶级盛宴&#xff0c;亚马逊云科技2024 re:Invent全球大会吸引了超过6万名现场观众以及40多万名线上参会者。而大会上生成式AI的相关话题和内容&#xff0c;也成为了所有观众关注的焦点。 大会期间&#xff0c;亚马逊云科技全球服务副总…...

Android 因为混淆文件配置,打release包提示running R8问题处理

一、报错信息 Missing classes detected while running R8. Please add the missing classes or apply additional keep rules that are generated in E:\workplace\xxxxxx\app\build\outputs\mapping\release\missing_rules.txt. Missing class org.mediakit.R$layout (refer…...

20241209给Ubuntu20.04系统的的交换分区增加为20GB的步骤

20241209给Ubuntu20.04系统的的交换分区增加为20GB的步骤 2024/12/9 21:10 缘起&#xff0c;编译中科创达的高通CM6125模块的Android10的时候&#xff0c;老报错。 编译环境可以编译荣品的RK3566的Android13/Buildroot。 以前荣品的RK3566的Android13的编译环境是可以编译通CM6…...

挑战杯推荐项目

“人工智能”创意赛 - 智能艺术创作助手&#xff1a;借助大模型技术&#xff0c;开发能根据用户输入的主题、风格等要求&#xff0c;生成绘画、音乐、文学作品等多种形式艺术创作灵感或初稿的应用&#xff0c;帮助艺术家和创意爱好者激发创意、提高创作效率。 ​ - 个性化梦境…...

【OSG学习笔记】Day 18: 碰撞检测与物理交互

物理引擎&#xff08;Physics Engine&#xff09; 物理引擎 是一种通过计算机模拟物理规律&#xff08;如力学、碰撞、重力、流体动力学等&#xff09;的软件工具或库。 它的核心目标是在虚拟环境中逼真地模拟物体的运动和交互&#xff0c;广泛应用于 游戏开发、动画制作、虚…...

CentOS下的分布式内存计算Spark环境部署

一、Spark 核心架构与应用场景 1.1 分布式计算引擎的核心优势 Spark 是基于内存的分布式计算框架&#xff0c;相比 MapReduce 具有以下核心优势&#xff1a; 内存计算&#xff1a;数据可常驻内存&#xff0c;迭代计算性能提升 10-100 倍&#xff08;文档段落&#xff1a;3-79…...

macOS多出来了:Google云端硬盘、YouTube、表格、幻灯片、Gmail、Google文档等应用

文章目录 问题现象问题原因解决办法 问题现象 macOS启动台&#xff08;Launchpad&#xff09;多出来了&#xff1a;Google云端硬盘、YouTube、表格、幻灯片、Gmail、Google文档等应用。 问题原因 很明显&#xff0c;都是Google家的办公全家桶。这些应用并不是通过独立安装的…...

BCS 2025|百度副总裁陈洋:智能体在安全领域的应用实践

6月5日&#xff0c;2025全球数字经济大会数字安全主论坛暨北京网络安全大会在国家会议中心隆重开幕。百度副总裁陈洋受邀出席&#xff0c;并作《智能体在安全领域的应用实践》主题演讲&#xff0c;分享了在智能体在安全领域的突破性实践。他指出&#xff0c;百度通过将安全能力…...

基于 TAPD 进行项目管理

起因 自己写了个小工具&#xff0c;仓库用的Github。之前在用markdown进行需求管理&#xff0c;现在随着功能的增加&#xff0c;感觉有点难以管理了&#xff0c;所以用TAPD这个工具进行需求、Bug管理。 操作流程 注册 TAPD&#xff0c;需要提供一个企业名新建一个项目&#…...

水泥厂自动化升级利器:Devicenet转Modbus rtu协议转换网关

在水泥厂的生产流程中&#xff0c;工业自动化网关起着至关重要的作用&#xff0c;尤其是JH-DVN-RTU疆鸿智能Devicenet转Modbus rtu协议转换网关&#xff0c;为水泥厂实现高效生产与精准控制提供了有力支持。 水泥厂设备众多&#xff0c;其中不少设备采用Devicenet协议。Devicen…...

spring Security对RBAC及其ABAC的支持使用

RBAC (基于角色的访问控制) RBAC (Role-Based Access Control) 是 Spring Security 中最常用的权限模型&#xff0c;它将权限分配给角色&#xff0c;再将角色分配给用户。 RBAC 核心实现 1. 数据库设计 users roles permissions ------- ------…...

深度解析:etcd 在 Milvus 向量数据库中的关键作用

目录 &#x1f680; 深度解析&#xff1a;etcd 在 Milvus 向量数据库中的关键作用 &#x1f4a1; 什么是 etcd&#xff1f; &#x1f9e0; Milvus 架构简介 &#x1f4e6; etcd 在 Milvus 中的核心作用 &#x1f527; 实际工作流程示意 ⚠️ 如果 etcd 出现问题会怎样&am…...

FTXUI::Dom 模块

DOM 模块定义了分层的 FTXUI::Element 树&#xff0c;可用于构建复杂的终端界面&#xff0c;支持响应终端尺寸变化。 namespace ftxui {...// 定义文档 定义布局盒子 Element document vbox({// 设置文本 设置加粗 设置文本颜色text("The window") | bold | color(…...