(自用)Java学习-5.15(模糊搜索,收藏,购物车)

1. 模糊搜索商品功能
  • 前端实现

    • 通过解析URL参数(如search=联想)获取搜索关键字,发送AJAX GET请求到后端接口/product/searchGoodsMessage

    • 动态渲染搜索结果:若结果非空,循环遍历返回的商品数据,生成商品卡片(包含图片、价格、标题),并绑定收藏和购物车功能按钮;若结果为空,显示"无商品信息"。

    • 使用replace()方法动态替换模板中的占位符(如#{id}#{price})。

  • 后端实现

    • 控制器接收关键字info,调用服务层执行模糊查询。

    • SQL逻辑SELECT * FROM t_product WHERE title LIKE '%#{info}%' AND status=1 ORDER BY priority DESC LIMIT 0,12,限制返回前12条数据。

    • 返回JSON格式的商品列表数据。


2. 添加收藏功能
  • 前端实现

    • 点击"加入收藏"按钮触发addFavoriteUse(pid)函数,弹出确认框后发送AJAX请求到/favorite/addFavoriteUse

    • 成功回调后更新按钮状态(如图标变为"取消收藏")。

  • 后端实现

    • 控制器从会话中获取用户ID和用户名,调用服务层插入收藏记录。

    • 服务层逻辑

      1. 根据商品ID查询商品详情(Product表)。

      2. 将商品信息(标题、价格、图片)与用户ID一起存入收藏表t_favorites

    • SQL逻辑INSERT INTO t_favorites插入完整收藏记录,返回生成的自增收藏ID(fid)。


3. 添加购物车功能
  • 前端实现

    • 点击"加入购物车"按钮触发addProToCart(id, price),发送POST请求到/cart/addProToCart,参数包含商品ID、价格和数量(默认1)。

    • 根据后端返回状态码弹出成功或失败提示。

  • 后端实现

    • 核心逻辑

      1. 检查当前用户的购物车中是否已存在该商品。

      2. 若存在,更新商品数量(num = num + 1);若不存在,新增购物车记录。

    • SQL逻辑

      • 查询:SELECT * FROM t_cart WHERE pid=#{pid} AND uid=#{uid}

      • 插入:INSERT INTO t_cart记录商品、用户、数量、价格等信息。

      • 更新:UPDATE t_cart SET num=#{num}


4. 商品详情展示
  • 前端实现

    • 从URL参数中提取商品ID(pid),请求接口/product/getProDetail获取详情数据。

    • 动态渲染商品标题、价格、库存,并加载多张商品图片(如1_big.png1.jpg)。

  • 后端实现

    • SQL逻辑SELECT * FROM t_product WHERE id=#{pid},直接返回商品完整信息。

5. 购物车展示
  • 前端实现

    • 请求接口/cart/showCartInfo获取当前用户的购物车列表数据。

    • 动态生成表格,展示商品图片、标题、单价、数量(支持增减操作)、小计和删除按钮。

    • 使用模板替换占位符(如#{cid}#{image})填充数据。

  • 后端实现

    • SQL逻辑 :联表查询t_cartt_product,返回视图对象CartVo,包含购物车ID、商品信息、数量、小计等字段。

    • 查询语句

      sql 复制代码
      SELECT c.cid, c.pid, c.uid, c.num, p.price, p.image, p.title 
      FROM t_cart c LEFT JOIN t_product p ON c.pid = p.id 
      WHERE c.uid=#{uid} ORDER BY c.modified_time DESC;

6. 关键技术点
  1. 前后端交互

    • 使用AJAX异步请求,数据格式为JSON,通过RESTful风格接口通信。
  2. 数据库操作

    • MyBatis实现SQL映射,动态拼接查询条件(如模糊搜索LIKE)。

    • 联表查询优化数据展示(如购物车关联商品表)。

  3. 功能扩展性

    • 分页逻辑(LIMIT 0,12)支持后续扩展更多商品加载。

    • 收藏和购物车通过用户会话(HttpSession)隔离不同用户数据。

相关推荐
代码老y10 分钟前
Spring Boot + MyBatis + Vue:全栈开发中的最佳实践
vue.js·spring boot·mybatis
天天摸鱼的java工程师10 分钟前
如何设计一个用户签到系统,支持连续签到统计?
java·后端
晨曦54321011 分钟前
针对经济学大数据的 Python 爬虫实践指南
开发语言·爬虫·python
上位机付工13 分钟前
C#上位机实现报警语音播报
开发语言·c#·上位机·plc·运动控制卡·语音播报·报警播报
千千道16 分钟前
QT 中使用 QSettings 读写 ini 配置文件
开发语言·qt
@菜菜_达23 分钟前
AgGrid学习笔记
笔记·学习·arcgis
程序员Xu26 分钟前
Vulkan学习笔记10—统一缓冲区
服务器·笔记·学习
海海不掉头发29 分钟前
【2025 年】软件体系结构考试试卷-期末考试
java·服务器·软件体系结构
智_永无止境41 分钟前
集合的处理:JDK和Guava孰强孰弱?
java·jdk·集合·guava
Q_Q19632884751 小时前
python+uniapp基于微信小程序的高校二手商品交易系统
spring boot·python·微信小程序·django·flask·uni-app·node.js