尚品汇-H5移动端整合系统（五十五）

news2024/9/25 15:12:15

目录：

（1）运行前端页面

（2）启动前端页面

（3）添加搜索分类接口

（4）购物车模块修改

（5）登录模块

（6）订单模块

（7）支付系统

（8）查看我的订单

（1）运行前端页面

将页面放入nginx中 配置nginx.conf 

server {
        listen       8989;
        server_name  localhost;

        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        location / {
            root   h5;
            index  index.html index.htm;
        }
        #error_page  404              /404.html;
        # redirect server error pages to the static page /50x.html
        #
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }     
    }

前面用的8086，这里新添加一个server 

重要！ 访问首页 之后  点击我的 设置 修改 base路径 改为当前网关地址 http://localhost

（2）启动前端页面

ServerGatewayApplication :80/

ServiceProductApplication [devtools] :8206/

ServiceListApplication [devtools] :8203/

ServiceItemApplication [devtools] :8202/

查看首页，

商品检索：

在Nacos网关配置中添加配置

- id: service-list

          uri: lb://service-list

          predicates:

            - Path=/*/list/** # 路径匹配

商品详情

需要项目启动，启动成功后就行获取数据列表

其次需要修改配置：

（3）添加搜索分类接口

 这个分类接口不同需要修改：

service-product

代码跟原来写的一样，只是路经不同，新建一个conttroller

/**
 * date:2022/6/21 10:34
 * 描述：
 **/
@RestController
@RequestMapping("/api/product/")
public class IndexApiController {
    @Autowired
    private ManageService manageService;

    @GetMapping("getBaseCategoryList")
    public Result getBaseCategoryList(){
        //  调用服务层方法
        List<JSONObject> list = manageService.getBaseCategoryList();
        return Result.ok(list);
    }
}

 

 

（4）购物车模块修改

 

 实现选择清空状态保存：

购物车控制器：


@GetMapping("/allCheckCart/{isChecked}")
public Result allCheckCart(@PathVariable Integer isChecked,HttpServletRequest request){
    //  获取用户Id
    String userId = AuthContextHolder.getUserId(request);
    //  判断用户Id 为空
    if (StringUtils.isEmpty(userId)){
        userId = AuthContextHolder.getUserTempId(request);
    }

    //  调用方法
    this.cartService.allCheckCart(userId,isChecked);
    //  默认返回
    return Result.ok();
}

接口： 


/**
 * 选中购物车列表
 * @param userId
 * @param isChecked
 */
void allCheckCart(String userId, Integer isChecked);

实现类： 


@Override
public void allCheckCart(String userId, Integer isChecked) {
    //  获取到购物车key
    String cartKey = this.getCartKey(userId);
    List<CartInfo> cartInfoList = this.redisTemplate.opsForHash().values(cartKey);

    //  声明一个Map 集合
    HashMap<String, Object> hashMap = new HashMap<>();
    //  循环遍历
    for (CartInfo cartInfo : cartInfoList) {
        cartInfo.setIsChecked(isChecked);
        hashMap.put(cartInfo.getSkuId().toString(),cartInfo);
    }
    //  将数据存储到购物车中
    this.redisTemplate.opsForHash().putAll(cartKey,hashMap);
}

选中后，再刷新页面也可以选中： 

清空: /api/cart/clearCart

@GetMapping("clearCart")
public Result clearCart(HttpServletRequest request){
    // 如何获取userId
    String userId = AuthContextHolder.getUserId(request);
    if (StringUtils.isEmpty(userId)) {
        // 获取临时用户Id
        userId = AuthContextHolder.getUserTempId(request);
    }
    cartService.clearCart(userId);
    return Result.ok();
}


/**
 * 清空购物车
 * @param userId
 */
void clearCart(String userId);



@Override
public void clearCart(String userId) {
    //  获取购物车key
    String cartKey = getCartKey(userId);
    //  删除数据
    redisTemplate.delete(cartKey);
}

点击清空： 

清空后刷新页面就没了 

（5）登录模块

点击结算，判断是否登录，进行跳转登录页面 

登录模块信息发生变化：

将原来的接收对象UserInfo 改为LoginVo

@Data
@ApiModel(description="登录对象")
public class LoginVo {

    @ApiModelProperty(value = "手机号")
    private String phone;

    @ApiModelProperty(value = "密码")
    private String password;

    @ApiModelProperty(value = "IP")
    private String ip;
}

 这里可以改登录的接口实体类，先进行演示，但是已改就不能通用了，我们可以吧这个接口改成通用的接口，或者重新写一个登录的接口

@PostMapping("login")
public Result login(@RequestBody LoginVo loginVo, HttpServletRequest request){

   控制器内容不变
}

接口： 



UserInfo login(LoginVo loginVo);

实现类： 


@Override
public UserInfo login(LoginVo loginVo) {
    //  select * from user_info where login_name = ? and passwd = ?
    QueryWrapper<UserInfo> userInfoQueryWrapper = new QueryWrapper<>();
    //  admin
    userInfoQueryWrapper.eq("login_name",loginVo.getPhone());
    //  111111 ---> 加密之后的数据。 对其进行了md5加密
    String passwd = loginVo.getPassword();
    String newPassword = DigestUtils.md5DigestAsHex(passwd.getBytes());
    //  96e79218965eb72c92a549dd5a330112
    userInfoQueryWrapper.eq("passwd",newPassword);
    UserInfo info = userInfoMapper.selectOne(userInfoQueryWrapper);
    //  判断
    if (info!=null){
        return info;
    }
    return null;
}

 

登录成功跳转到订单页面： 

（6）订单模块

点击去结算：

 

收货地址列表

控制器：http://localhost/api/user/userAddress/auth/findUserAddressList

//  http://localhost/api/user/userAddress/auth/findUserAddressList
@GetMapping("userAddress/auth/findUserAddressList")
public Result findUserAddressList(HttpServletRequest request){
    String userId = AuthContextHolder.getUserId(request);
    return Result.ok(userAddressService.findUserAddressListByUserId(userId));
}

 

 （7）支付系统

这里我们现为了演示，先修改部分代码，到时候需要提供两个接口 

生成二维码：要替换掉原来的对象

AlipayTradeWapPayRequest alipayRequest = new AlipayTradeWapPayRequest();
bizContent.put("product_code", "QUICK_WAP_WAY");

 

（8）查看我的订单

添加一个状态查询参数： 

@GetMapping("/auth/{page}/{limit}")
    public Result getOrderPage(@PathVariable Long page,
                               @PathVariable Long limit,
                               HttpServletRequest request){
        //  获取到用户Id
        String userId = AuthContextHolder.getUserId(request);
        String orderStatus = request.getParameter("orderStatus");
        //  声明一个 page 对象
        Page<OrderInfo> orderInfoPage = new Page<>(page, limit);

        //  调用服务层方法查询数据：第二个参数？
        IPage<OrderInfo> infoIPage = this.orderService.getOrderPage(orderInfoPage,userId,orderStatus);
        //  返回数据
        return Result.ok(infoIPage);
    }



    @Override
    public IPage<OrderInfo> getOrderPage(Page<OrderInfo> orderInfoPage, String userId, String orderStatus) {


        IPage<OrderInfo> infoIPage = orderInfoMapper.selectUserOrderPage(orderInfoPage,userId,orderStatus);
        //  获取到订单状态：中文
        infoIPage.getRecords().stream().forEach(orderInfo -> {
            orderInfo.setOrderStatusName(OrderStatus.getStatusNameByStatus(orderInfo.getOrderStatus()));
        });
        //  返回数据。
        return infoIPage;
    }



IPage<OrderInfo> selectUserOrderPage(Page<OrderInfo> orderInfoPage, @Param("userId") String userId, @Param("orderStatus")String orderStatus);



<select id="selectUserOrderPage" resultMap="OrderInfoMap">
    SELECT
        oi.id,
        oi.consignee,
        oi.consignee_tel,
        oi.total_amount,
        oi.order_status,
        oi.user_id,
        oi.payment_way,
        oi.delivery_address,
        oi.order_comment,
        oi.out_trade_no,
        oi.trade_body,
        oi.create_time,
        oi.expire_time,
        oi.process_status,
        od.id detail_id,
        od.order_id,
        od.sku_id,
        od.sku_name,
        od.img_url,
        od.order_price,
        od.sku_num,
        od.create_time
    FROM
        order_info oi
            INNER JOIN order_detail od ON od.order_id = oi.id
     <where>
          AND user_id = #{userId}
          AND oi.order_status NOT IN ('CLOSED', 'SPLIT')
          <if test="orderStatus != null and orderStatus != ''">
            and oi.order_status = #{orderStatus}
          </if>
     </where>
    ORDER BY
        oi.id DESC
</select>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/2163914.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

ubuntu安装libtorch

ubuntu安装libtorch

Ubuntu20.04安装libtorch 〇、前期准备1、查看NVIDIA显卡算力和CUDA版本支持的算力2、查看CUDA与显卡驱动的版本对应 一、NVIDIA显卡驱动安装1、下载显卡驱动2、安装驱动A. 安装依赖B. 禁用nouveau驱动C. 显卡驱动安装 3、参考 二、CUDA安装1、下载安装CUDA2、测试CUDA是否安装…
阅读更多...
今年双11哪些东西值得买？分享五款实用耐用的好物，不再乱花钱！

今年双11哪些东西值得买？分享五款实用耐用的好物，不再乱花钱！

随着一年一度的1111购物节脚步渐近&#xff0c;是否还在为挑选商品而犹豫不决&#xff1f;别担心&#xff0c;我们贴心整理了一份双十一必买好物推荐&#xff0c;专为追求品质生活的您量身打造。跟随这份清单&#xff0c;让您的数字生活更加丰富多彩&#xff0c;无需多虑&#…
阅读更多...
四川财谷通信息技术有限公司抖音小店领域的新势力

四川财谷通信息技术有限公司抖音小店领域的新势力

在当今这个数字化浪潮汹涌的时代&#xff0c;电子商务已成为推动经济发展的重要引擎&#xff0c;而短视频平台抖音的崛起&#xff0c;更是为电商行业注入了前所未有的活力与机遇。在这片充满无限可能的蓝海中&#xff0c;四川财谷通信息技术有限公司凭借其敏锐的市场洞察力和强…
阅读更多...
zabbix监控某特定进程是否挂掉

zabbix监控某特定进程是否挂掉

我现在已经在被监控机器&#xff08;A&#xff09;上装好了zabbix-agent&#xff0c;同时也在zabbix-server网页端添加了机器A 1&#xff0c;确定好要监控的进程 假如我想监控机器A上面的salt-minion这个进程&#xff0c;首先通过ps -ef 找到这个进程的命令启动行。 2&#x…
阅读更多...
828华为云征文 | 云服务器Flexus X实例，Docker集成搭建FC-web模拟器

828华为云征文 | 云服务器Flexus X实例，Docker集成搭建FC-web模拟器

828华为云征文 | 云服务器Flexus X实例&#xff0c;Docker集成搭建FC-web模拟器 华为云端口放行 服务器放行对应端口9995 Docker安装并配置镜像加速 1、购买华为云 Flexus X 实例 Flexus云服务器X实例-华为云 (huaweicloud.com) 2、docker安装 yum install -y docker-ce3、验证…
阅读更多...
vue2+elementUI实现handleSelectionChange批量删除-前后端

vue2+elementUI实现handleSelectionChange批量删除-前后端

功能需求&#xff1a;实现选中一个或多个执行批量删除操作 在elementUI官网选择一个表格样式模板&#xff0c;Element - The worlds most popular Vue UI framework 这里采用的是 将代码复制到前端&#xff0c;这里是index.vue <template><el-button type"dang…
阅读更多...
JavaScript类型转换和相等性详解

JavaScript类型转换和相等性详解

类型转换 10"objects" //10objects,数字10转换为字符串 "7"*"4" //28&#xff0c;两个字符串均转为数字,只要不是加&#xff0c;其他都按两个数字算 var n 1-"x"// NaN&#xff0c;字符串x无法转化为数字 n"objects"//…
阅读更多...
眼镜检测系统源码分享

眼镜检测系统源码分享

眼镜检测检测系统源码分享 [一条龙教学YOLOV8标注好的数据集一键训练_70全套改进创新点发刊_Web前端展示] 1.研究背景与意义 项目参考AAAI Association for the Advancement of Artificial Intelligence 项目来源AACV Association for the Advancement of Computer Vision …
阅读更多...
基础的点云转换

基础的点云转换

对于点云处理而言&#xff0c;最简单也逃不过的就是点云转换了&#xff0c;我们就从点云转换开始&#xff0c;来一步步完成点云加速的学习。点云基础转换是3D点云处理中的一个重要步骤。它的主要目的是将点云从一个坐标系转换到另一个坐标系中&#xff0c;通常是为了方便后续处…
阅读更多...
数据结构：搜索二叉树

数据结构：搜索二叉树

前言 在前面我们已经学习了二叉树的基础操作&#xff0c;但是&#xff0c;仅仅是二叉树&#xff0c;没有太大的作用啊&#xff0c;存数据效果没有顺序表和链表好&#xff0c;那为啥还要学二叉树呢&#xff1f; 这不就来了嘛&#xff0c;给二叉树增加一些性质&#xff0c;作用不…
阅读更多...
徐州网站建设的最新趋势与技术

徐州网站建设的最新趋势与技术

随着徐州经济的快速发展&#xff0c;网站建设在当地越来越受到重视。不同类型的企业和组织都希望通过优化他们的在线形象来吸引更多客户。因此&#xff0c;了解目前的趋势与技术是实现高效网站建设的关键。 1. 响应式设计 响应式设计是当前网站建设的核心趋势之一。无论是桌面…
阅读更多...
毕业设计选题：基于ssm+vue+uniapp的校园失物招领小程序

毕业设计选题：基于ssm+vue+uniapp的校园失物招领小程序

开发语言&#xff1a;Java框架&#xff1a;ssmuniappJDK版本&#xff1a;JDK1.8服务器&#xff1a;tomcat7数据库&#xff1a;mysql 5.7&#xff08;一定要5.7版本&#xff09;数据库工具&#xff1a;Navicat11开发软件&#xff1a;eclipse/myeclipse/ideaMaven包&#xff1a;M…
阅读更多...
基于VITA57.1标准的4通道2.8GSPS 16位JESD204B接口DAC播放子卡

基于VITA57.1标准的4通道2.8GSPS 16位JESD204B接口DAC播放子卡

板卡概述 FMC171是一款基于VITA57.1标准的4通道2.8GSPS采样率16位分辨率JESD204B接口DAC回放子卡模块。该板卡采用ADI公司的AD9144&#xff0c;实现4路模拟输出&#xff0c;数字接口通过8通道的JESD204B进行互联。 该板卡支持本地参考时钟、外部输入参考时钟、外部VCO时钟以及…
阅读更多...
门面模式详解：提高代码可维护性的利器

门面模式详解：提高代码可维护性的利器

门面模式是一种结构型设计模式&#xff0c;它通过为复杂的子系统提供一个统一的接口&#xff0c;使得子系统更容易使用。门面模式隐藏了系统的复杂性&#xff0c;并向客户端提供了一个简化的接口。 一&#xff0c;门面模式的结构 门面模式&#xff08;Facade Pattern&#xf…
阅读更多...
有没有遇到过Mybatisplus插件失效?

有没有遇到过Mybatisplus插件失效?

背景 相信mybatisplus应该很多人都用过，当然有些人在项目中使用的是tk.mybatis，那么今天说到这个话题原理都是一样，首先mybatisplus会有很多插件，这些插件都会形成一个拦截器链路，具体可以学习下原理，这个地方就不过多叙说了，毕竟不是本篇博文的重点，那言归正传，比如…
阅读更多...
普渡大学和麻省理工学院合作开发集成视触觉指尖传感器的5自由度抓手

普渡大学和麻省理工学院合作开发集成视触觉指尖传感器的5自由度抓手

虽然机器人已经开始在现代制造业、医疗、服务业等领域进行渗透&#xff0c;但对于机器人尤其是机械臂的操作能力&#xff0c;仍然有很大的提升空间&#xff0c;传统多指机器人手虽然能够实现复杂的操作任务&#xff0c;但其高度冗余性也带来了不必要的复杂性。近日来自普渡大学…
阅读更多...
WebRTC中的维纳滤波器实现详解：基于决策导向的SNR估计

WebRTC中的维纳滤波器实现详解：基于决策导向的SNR估计

目录 1. 维纳滤波器的基本原理2. WebRTC中的维纳滤波器实现3. 代码逐步剖析4. 总结 在WebRTC的噪声抑制模块中&#xff0c;维纳滤波器&#xff08;Wiener Filter&#xff09;是一种非常常见且重要的滤波器&#xff0c;用于提高语音信号的清晰度并抑制背景噪声。本文将详细解释维…
阅读更多...
Hugging Face Transformer：从原理到实战的全面指南

Hugging Face Transformer：从原理到实战的全面指南

一、前言 我们知道ChatGPT和所有预训练大语言模型的核心是什么&#xff1f;其实就是 Transformer&#xff0c;Hugging Face 的火爆离不开他们开源的这个 Transformers 库。这个开源库里有数万个我们可以直接调用的模型。很多场景下&#xff0c;这个开源模型已经足够我们使用了。…
阅读更多...
【Pyside】pycharm2024配置conda虚拟环境

【Pyside】pycharm2024配置conda虚拟环境

知识拓展 Pycharm 是一个由 JetBrains 开发的集成开发环境&#xff08;IDE&#xff09;&#xff0c;它主要用于 Python 编程语言的开发。Pycharm 提供了代码编辑、调试、版本控制、测试等多种功能&#xff0c;以提高 Python 开发者的效率。 Pycharm 与 Python 的关系 Pycharm 是…
阅读更多...
2024年9月24日---关于MyBatis框架（3）

2024年9月24日---关于MyBatis框架（3）

五 Mybatis的缓存 5.1 Mybatis缓存简介 缓存(cache)&#xff1a;提前把数据存放到缓存当中&#xff0c;下一次再使用的时候&#xff0c;直接从缓存中拿&#xff0c;而不用再次去数据库中查询一次了。这样的优势在于&#xff1a;通过减少IO的⽅式&#xff0c;来提⾼程序的执⾏…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023