伙伴云客服论坛»论坛 › S区 › S客户管理 › 查看内容

0 评论

0 收藏

分享

超市管理系统

大明白 楼主 发布于 2023-6-4 22:52:16 阅读 2971 查看全部
搜更多： 百度 谷歌 360 搜狗 搜搜 有道 必应 即刻
目录
写代码之前的分析
相关数据表的创建
对应的配置文件
用户管理场景的实现
相关的数据对象
Mapper对象
Service对象
关于密码加密
Controller对象
关于用户名和密码的校验
前端代码
货物管理场景
数据对象
Service层
Controller
JsonController​编辑
前端页面
订单管理场景
数据对象
Mapper对象
Service对象
Controller对象
前端部分
纯前端设计
与我的文件搜索项目不同，上个项目我是为了练习我学的Java根底知识和多线程的使用，这个项目我会根据我学的SSM框架下停止制作，这个项目的代码量会更多
    首先这个项目是是模仿出一个超市后台管理系统的写这个项目的目的是为了稳固这一阶段我学的关于SSM框架学习的知识
写代码之前的分析

现实超市的用户角色：
    1顾客：可以从超市停止购物2货管：货品上架，货品下架，货品增量，货品减量，更新货品信息等3收银：录入订单，结账....（比如订单的创建，和订单的状态变化（未结账——>结账，或者取消订单））4老板：一些统计需求，进货情况，售货情况（也就是账单和货物量的情况）
场景梳理（我们这里将所有用户的功能集中到一个用户上）
    用户管理=用户注册+用户登录货物管理=货物上架+货物下架+货物信息更新+货物的阅读订单管理=订单的创建+订单的状态变化+订单的阅读
关于如何实现
    因为我是基于SSM框架停止创建项目，就涉及到SSM框架的分层，我分为三大层 Contoller（用于存储动态资源）+Service(提供一些模块化业务化的功能)+Mapper（用于支配Mybatis）,这些都是过程对象，和一些数据对象
超市管理系统-1.png


关于订单状态的变化情况
超市管理系统-2.png


比如创建订单这个过程会涉及什么呢？
超市管理系统-3.png


    我们发现一个订单的状态的变化，会涉及到多个操作（多条SQL语句），所以我们必需要保证操作的原子性，假设我们在创建订单的时候，已经把商品的库存减去了，但是呈现bug，那么我们的订单没有插入到表中，但是库存已经 减去了。这样就发生了错误，所以就要引入事务，将这一系列的操作变成了一个原子性的操作
相关数据表的创建


    创建数据库
    超市管理系统-4.png

    orders表，用来存储订单信息
    超市管理系统-5.png

    order_items表，用来存储的订单中的相关货物信息
    超市管理系统-6.png

    users表，用来存储我们注册的用户信息
    超市管理系统-7.png

    products表，用来存储我们的货物信息
    超市管理系统-8.png

各个数据表的关系
超市管理系统-9.png


对应的配置文件

超市管理系统-10.png


用户管理场景的实现

相关的数据对象

超市管理系统-11.png


    这个数据对象对应着我们的数据表users的封装数据，在我们支配数据库的时候对应一行数据 关于User数据对象，因为要被Mybatis调用，所以必需存在一个无参构造方法，和相关属性的setter方法，因为Mybatis就是默认先调用无参构造方法，和setter方法来注入相应的属性值，这里有@Date，所以不用我们自己写
Mapper对象

超市管理系统-12.png


Service对象

超市管理系统-13.png


    利用构造方法依赖注入我们的UserMapper对象
关于密码加密

    我们之前都是明文去保管密码，这次我们引入一个加密库（实际就是做hash，不是真正的加密），我们不再保管明文密码，我们这里引入的就是BCrypt算法
超市管理系统-14.png


    关于密码的等级
    超市管理系统-15.png

    密码一般我们都采用md5加密的方式，但是用md5加密，对于一个固定的字符串，其md5值是固定的，这样就会呈现彩虹表攻击情况。所谓彩虹表攻击就是指攻击者有一张表，里面有密码明文和对应md5值的对应关系，攻击者利用这些关系来破解用户密码。
Controller对象

超市管理系统-16.png


    我们将异常（将不合法的数据的校验也变为异常的款式）的处置与我们的业务分开
关于用户名和密码的校验

笼统父类类
超市管理系统-17.png


    对于密码和用户名这些校验都会有的校验方式，比如数据不能为空，不为null这些通用的放在一个笼统类中，然后让子类去继承，进一步减少了代码的数量
密码校验
超市管理系统-18.png


用户名校验
超市管理系统-19.png


    用户名校验对父类多了一个用户名的长度判断
关于异常的处置
超市管理系统-20.png


前端代码

超市管理系统-21.png


超市管理系统-22.png


    用户注册的表单，输入相应的数据，根据name和申请的途径找到对应的资源，提交对应的数据，经过各层的处置保管到数据库和session当前阅读器保管了当前用户 ,注册也是这套逻辑
货物管理场景

数据对象

Product数据对象
超市管理系统-23.png


    这个数据对象是对应着我们数据表的对象，是为了从数据表Product中获得数据和存储数据
ProductParam
超市管理系统-24.png


    这个对象是对应我们前端表单输入的数据的接收对象，因为我们前端不是将所有的货物信息都要手动输入的，比如user_id，这个数据是我们通过当前登录的用户是是谁得到的（通过session得到）
Mapper层
超市管理系统-25.png


Service层

超市管理系统-26.png


Controller

超市管理系统-27.png


超市管理系统-28.png


JsonController
超市管理系统-29.png



    因为修饰的是@RestController,所以是假设返回的是String类型，那么是text/html,假设是对象，集合类则默认是JSON
前端页面

上架货物的前端页面
超市管理系统-30.png


    这里是post方法，将数据提交到后端，其提交的数据跟productParam
展示所有货物信息+AJAX恳求所有货物的资源
超市管理系统-31.png


更新货物信息的HTML页面
超市管理系统-32.png


    更新货物的数据对象也是对应着productParam,但是比上架货物多了一个关于商品ID，其实productParam中有productId，之所以我们上架的时候不填productId,是因为他在数据表中是自增主键，你不填，相应的数据就是null，那么在插入的时候，会自动根据情况分配主键
流程分析
    访问create.html，商品上架的前提是必需先停止用户登录，用户未登录的话，是会跳转到登录页面，如何判断用户有没有登录，就靠session中的currentUser中的信息，货物上架的时候的上架用户id也是通过这个这个对象获得（我们把User类的对象存储在session，通过currentUser名称调用），先停止参数的合法性校验（复用之前的笼统类和异常处置），然后利用各层功能实现一个Product类的对象插入到数据表中，创建胜利就跳转首页
    超市管理系统-33.png

    阅读商品：我们访问list.html假设用户未登录，我们就不返回资源，而是跳转到登录页面，停止登录，假设是已经登录了，就会返回相应的数据，和跳转到相应货物信息的页面（我们是根据当前redirectUrl是否为空来判断到底是那种处置）
    超市管理系统-34.png

    关于我们product/list.json返回类型的规定，因为前端展示的信息和后端存储的信息不一样，所以我们在Controller内部类定义一个PoductView来专门处置返回的数据,返回的类型采用JSON，所以用@Controller+ResposneBody,返回的是集合对象
超市管理系统-35.png


超市管理系统-36.png


    更新商品的逻辑跟上架商品差不多，就是多了一个参数的输入，商品Id，一个在数据表插入，一个在数据表根据id停止更新操作
    超市管理系统-37.png

订单管理场景

数据对象

订单对象
超市管理系统-38.png


    用于封装关于订单的数据，用于存储进我们的orders表中
枚举类的内容
超市管理系统-39.png


    1表示未支付 2表示已支付
超市管理系统-40.png


    这个是用来存储我们详细的订单信息的，其中itemsList存储的是我们这个订单中每个订单项的信息，还有对应信息类型的转换，大约的内容就是这样
    超市管理系统-41.png

订单项的数据对象
超市管理系统-42.png


    首先为什么要有订单项这个数据，是为了让订单和商品的多对多关系变成两个一对多的关系这个OrderItem对象是为了将关于订单项的数据封装起来，然后对应order_items表的数据，停止存储到数据表中
超市管理系统-43.png


Mapper对象

OrderMapper对象
超市管理系统-44.png


OrderItemMapper对象
超市管理系统-45.png


Service对象

超市管理系统-46.png


Controller对象

关于创建订单
超市管理系统-47.png


关于详细的订单信息页面
超市管理系统-48.png

超市管理系统-49.png


订单取消和确认的操作
超市管理系统-50.png


关于前端订单列表信息展示
超市管理系统-51.png


前端部分

超市管理系统-52.png


超市管理系统-53.png


创建订单的大约的流程
    用户进入/order/create.html的静态资源，然后填写1-3,2-5这样的数据，点击提交按钮，form表单发起HTTP恳求（POST恳求/order/create.do的资源）后端：Controller：先判断是不是已经登录了，没登陆就跳转到首页，登录了就解析了1-3,2-5这种字符串为Map<商品id,购置数量的>的数据构造，然后调用service的创建订单功能Service:(对应订单创建整体作为一个事务@Transactional)
    超市管理系统-54.png

    Mapper:根据详细的SQL语句将订单信息和订单项的数据插入到相对应的表
    超市管理系统-55.png

    Cotroller:然后停止重定向到详细的订单信息页面,(order/detail/{uuid})阅读器会收到HTTP的重定向的响应，继续发送新的HTTP恳求，也是就是（order/detail/{uuid}的GET恳求）Controller:解析得到url中的uuid数据，然后判断用户是否登录Service：根据uuid查询到订单的根底信息(OrderMapper)，根据orderId查询到所有属于这个订单的相关数据项（OrderItemMapper）
    超市管理系统-56.png

    Controller MVC流程中，将查询到的订单信息作为order放到model中，使用order-detail作为view的名称（对应reasource/templates/order-datail.html文件中）,Spring配合（Thymeleaf）将Model和View结合在一起，生成最终的HTML内容，响应给前端
    超市管理系统-57.png

纯前端设计

我们上面的实现能让我们的功能是可用的，如今下面的设计就是将我们的前端变得美化一对，更加容易操作
首先让我们的页面有两个区域一个导航栏和一个功能区
超市管理系统-58.png

超市管理系统-59.png


    导航区是一样，功能区在不同功能下停止不同的功能模块的添加对公用的模块的css修饰
    超市管理系统-60.png

    然后各个模块多出来的功能就在这个框架的功能区去添加就行了
关于deatail(就是订单详情页面确实认和取消等的css修饰)
  1. .根本信息 {
  2.     background-color: rgba(255, 255, 255, .7);
  3.     border-radius: 8px;
  4.     padding: 16px;
  5. }
  7. .下一步 {
  8.     padding: 8px;
  9. }
  11. .下一步 a {
  12.     background-color: rgba(255, 255, 255, .7);
  13.     text-decoration: none;
  14. }
  16. .功能区 > * {
  17.     margin: 16px 0;
  18. }
复制代码
关于表格的修饰（比如商品的展示和订单的展示）
  1. .功能区 {
  2.     display: block;
  3.     padding: 16px;
  4. }
  6. table {
  7.     border-collapse: collapse;
  8.     border: 1px solid #000;
  9.     width: 100%;
  10. }
  12. th {
  13.     background-color: blue;
  14.     text-align: center;
  15.     padding: 4px 0;
  16. }
  18. td {
  19.     text-align: center;
  20.     padding: 4px 0;
  21. }
  23. tr:nth-child(even) {
  24.     background-color: bisque;
  25. }
  27. tr:nth-child(odd) {
  28.     background-color: chartreuse;
  29. }
复制代码
关于表单的修饰（比如登录注册等的表单）
  1. form {
  2.     background-color: rgba(255, 255, 255, .7);
  3.     padding: 24px;
  4.     border-radius: 8px;
  5.     box-shadow: 0 0 10px #000;
  7.     width: 400px;
  8.     display: flex;
  9.     flex-direction: column;
  10.     justify-content: flex-start;
  11.     align-items: stretch;
  12. }
  14. form > * {
  15.     margin: 8px 0;
  16. }
  18. label {
  19.     width: 100%;
  20. }
  22. input {
  23.     width: 100%;
  24. }
  26. input {
  27.     padding: 4px 8px;
  28.     outline: none;
  29.     height: 28px;
  30.     border-radius: 4px;
  31.     border: 1px solid #000;
  32. }
  34. button {
  35.     outline: none;
  36.     height: 28px;
  37.     border-radius: 4px;
  38.     border: 1px solid #000;
  39.     background-color: bisque;
  40. }
复制代码

测试项目功能

web自动化测试用例的设计

超市管理系统-61.png


超市管理系统-62.png



功能的改善点

回复

举报 使用道具

上一篇: 建立新零售生态系统的根本原则及数字化订单管理系统

下一篇: 写一个思维导图订单管理模块：管理员和用户对订单停止增删查改操作。

相关帖子
全部回复
暂无回帖，快来参与回复吧
返回列表 发新帖回复
本版积分规则 高级模式
B Color Image Link Quote Code Smilies

大明白
注册会员
主题 17
回复 17
粉丝 0
加好友 发私信
标签
PMP 销售 管理 零代码
产品
解决方案
学习资料
关于我们
进一步了解
取得联系
咨询专线
400 006 1585
关注服务号
微信交流群
© 2022 伙伴智慧(北京)信息技术有限公司京公网安备11010802025927号京ICP备12038259号 增值电信业务经营许可证:京B2-20201325
Created with Huoban.
|网站地图
快速回复 返回顶部 返回列表