AI 助理
备案控制台
开发者社区 开发与运维 文章 正文

JavaWeb10(实现结算&查看订单&订单详情)（二）

2023-10-09 53
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： JavaWeb10(实现结算&查看订单&订单详情)

2.2 查看我的订单

①底层代码

package com.zking.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import java.util.List;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import com.zking.biz.GoodsBiz;
import com.zking.biz.IGoodsBiz;
import com.zking.biz.IOrderBiz;
import com.zking.biz.IUserBiz;
import com.zking.biz.OrderBiz;
import com.zking.biz.UserBiz;
import com.zking.entity.Goods;
import com.zking.entity.Order;
import com.zking.entity.User;
/**
 * 订单们控制器  多个订单
 * @author PC
 *
 */
@WebServlet("/orders.do")
public class OrdersServlet extends HttpServlet {
  @Override
  protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    doPost(req, resp);
  }
  @Override
  protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    //设置编码
    req.setCharacterEncoding("utf-8");
    resp.setContentType("text/html; charset=UTF-8");
    //拿session和out
    HttpSession session = req.getSession();
    PrintWriter out = resp.getWriter();
    //从session中拿用户
     User u =(User)session.getAttribute("user");
    //servlet调用biz
    IOrderBiz iob = new OrderBiz();
    //调用获取订单集合方法
    List<Order> ordersls = iob.getAllByUser(u);
    //存起来
    req.setAttribute("ordersls", ordersls);
    //转发到myorder.jsp进行绑值
    req.getRequestDispatcher("myorder.jsp?index=6").forward(req, resp);
  }
}

②前端绑值

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core"  prefix="c"%>
<!DOCTYPE html>
<html lang="en">
<head>
   <title>我的订单</title>
    <!-- 支持手机端 -->
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <!-- 引入CSS -->
    <link rel="stylesheet" href="CSS/bootstrap.css" />
    <!-- 引入Bootstrap图标的样式 -->
    <link rel="stylesheet" href="font/bootstrap-icons.css" />
    <style>
        .navbar-collapse {
            /*1代表弹性扩大占用父容器剩余部分   0代表不占用*/
            flex-grow: 0;
        }
        .active {
              /*加粗*/
            font-weight: bold;
        }
        .text-right  button{
                width: 120px;/*宽度*/
                height: 30px;/*高度*/
                line-height: 10px;/*行高*/
                margin-top: 10px;/*上间距*/
        }
    </style>
</head>
<body>
   <!--页面包含  -->
   <jsp:include page="header.jsp"></jsp:include>
    <!-- 我的订单 -->
    <div class="container">
      <!--当订单集合为空时  -->
      <c:if test="${empty ordersls}">
          <div style="margin-top: 50px;margin-bottom:50px"  class="h3 text-center text-pink">亲爱的${user.uname},订单空空如也喔<a href="index.do?index=1">快去奖励自己吧！</a></div>
        <div class="text-center">
           <img width="700px" src="img/bz11.jpg">
        </div>
      </c:if>
      <!--当订单集合不为空时  -->
      <c:if test="${not empty ordersls}">
         <!--  text-center居中 -->
        <table style="margin-top: 20px;" class="table table-hover  text-center ">
            <!-- class="bg-primary" 加颜色 -->
            <thead class="bg-primary" style="color: aliceblue;">
                <tr>
                    <th scope="col">订单编号</th>
                    <th scope="col">收货地址</th>
                    <th scope="col">订单总价</th>
                    <th scope="col">购买者</th>
                    <th scope="col">操作</th>
                </tr>
            </thead>
            <tbody>
              <!--绑定订单的值  -->
             <c:forEach items="${ordersls}" var="o">
               <tr style="height:80px;line-height: 50px">
                    <th scope="row">${o.oid}</th>
                    <td>${o.oaddress}</td>
                    <td>${o.osumprice}&yen;</td>
                    <td>${o.user.uname}</td>
                    <td>
                    <a href="deleteOrder.do?oid=${o.oid}" onclick="return confirm('确定删除嘛?(^.^)')" >删除订单 </a>&nbsp;&nbsp;&nbsp;
                    <a href="orderInfo.do?oid=${o.oid}">查看订单详情 </a>
                    </td>
                </tr>
             </c:forEach> 
            </tbody>
            </table>
      </c:if>
    </div>
    <!-- 引入jQuery的类库 -->
    <!-- 再引入Bootstrap的类库 -->
    <script src="js/jquery-3.6.4.js"></script>
    <script src="js/bootstrap.js"></script>
</body>
</html>

2.3 查看订单详情

①页面跳转，传参

//跳转 转发到订单详情页面进行绑值
req.getRequestDispatcher("orderinfo.jsp").forward(req, resp);

②底层代码

package com.zking.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import javax.servlet.http.HttpSession;
import com.zking.biz.IOrderBiz;
import com.zking.biz.IUserBiz;
import com.zking.biz.OrderBiz;
import com.zking.biz.UserBiz;
import com.zking.entity.Order;
import com.zking.entity.User;
/**
 * 查看订单详情控制器
 * @author PC
 *
 */
@WebServlet("/orderInfo.do")
public class OrderInfoServlet extends HttpServlet {
  @Override
  protected void doGet(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    doPost(req, resp);
  }
  @Override
  protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
    //设置编码
    req.setCharacterEncoding("utf-8");
    resp.setContentType("text/html; charset=UTF-8");
    //拿session和out
    HttpSession session = req.getSession();
    PrintWriter out = resp.getWriter();
    //接收oid
    String oid=req.getParameter("oid");
    //servlet调biz层
    IOrderBiz iob = new OrderBiz();
    //调用单个查询的方法
    Order order = iob.getOrder(oid);
    //存起来
    req.setAttribute("myorder",order);//键  值
    //跳转 转发到订单详情页面进行绑值
    req.getRequestDispatcher("orderinfo.jsp").forward(req, resp);
    //两种思路
    /**
     * select * from tb_orderitem where oid=?;
     * 1.根据订单编号查找到对应的订单项集合  存起来  去订单详情页面绑定值
     * 
     * select * from tb_order where oid=?; 单个查询   在order实体类写了一个items
     * 2.根据订单编号查找到对应的订单  把订单存起来  去订单详情界面  即可以绑定该订单的值又可以绑定订单详情的值 √
     * 
     * 
     */
  }
}

③前端绑值

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core"  prefix="c"%>
<!DOCTYPE html>
<html lang="en">
<head>
   <title>查看订单详情</title>
    <!-- 支持手机端 -->
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <!-- 引入CSS -->
    <link rel="stylesheet" href="CSS/bootstrap.css" />
    <!-- 引入Bootstrap图标的样式 -->
    <link rel="stylesheet" href="font/bootstrap-icons.css" />
    <style>
        .navbar-collapse {
            /*1代表弹性扩大占用父容器剩余部分   0代表不占用*/
            flex-grow: 0;
        }
        .active {
              /*加粗*/
            font-weight: bold;
        }
        .text-right  button{
                width: 120px;/*宽度*/
                height: 30px;/*高度*/
                line-height: 10px;/*行高*/
                margin-top: 10px;/*上间距*/
        }
    </style>
</head>
<body>
    <!-- 订单详情 -->
    <div class="container" style="margin-top: 40px">
      <!--当订单为空时  -->
      <c:if test="${empty myorder}">
        <jsp:forward page="orders.do?index=6"></jsp:forward>
      </c:if>
      <!--当购物车集合不为空时  -->
      <c:if test="${not empty myorder}">
         <!--  text-center居中 -->
        <table style="margin-top: 20px;" class="table table-hover  text-center ">
            <!-- class="bg-primary" 加颜色 -->
            <thead class="bg-primary" style="color: aliceblue;">
                <tr>
                    <th scope="col">订单项编号</th>
                    <th scope="col">订单编号</th>
                    <th scope="col">商品名称</th>
                    <th scope="col">商品价格</th>
                    <th scope="col">商品图片</th>
                    <th scope="col">购买数量</th>
                    <th scope="col">小计</th>
                </tr>
            </thead>
            <tbody>
              <!--对象不能自己遍历 foreach 跟实体类一致 -->
              <!--绑对应订单项的值  -->
             <c:forEach items="${myorder.items}" var="oi">
               <tr style="height:80px;line-height: 50px">
                    <th scope="row">${oi.oiid}</th>
                    <td>${oi.oid}</td>
                    <td>${oi.goods.gname}</td>
                    <td>${oi.goods.gprice}元</td>
                    <td><img width="80px" src="${oi.goods.gpath}"></td>
                    <td>${oi.oinum}</td>
                    <td><span class="xx">${oi.oiprice}</span>元</td>
                </tr>
             </c:forEach> 
            </tbody>
            </table>
        <!-- 合计 -->
        <div class="text-right">
            <h2>合计:<span id="sums">229.3</span>元</h2>
           <a href="orders.do?index=6"> <button type="button" class="btn btn-success" >点击返回</button></a>
        </div>
      </c:if>
    </div>
    <!-- 引入jQuery的类库 -->
    <!-- 再引入Bootstrap的类库 -->
    <script src="js/jquery-3.6.4.js"></script>
    <script src="js/bootstrap.js"></script>
    <script type="text/javascript">
      //加载DOM  jquery
    $(function(){
     //统计价格
      var sum = 0.0;
      //遍历
      $(".xx").each(function(i,v){//下标  值
      //累计求和
      sum+=parseFloat(v.innerHTML);
      });
      //保留1位小数
      sum=sum.toFixed(2);
      //给span标签赋值
      $("#sums").html(sum);
    })
      //即要拿id 就直接把id设置成gid
      function myf(gid) {
      //拿文本框的数量
      var num=$("#"+gid).val();
      //跳转到servlet
      location.href="updateCart.do?gid="+gid+"&num="+num;
    }
    /* //如果仍然出现很多位小数 则采用以下方法保留1位小数
      String s = String.format("%.1f",this.oiprice);
      this.oiprice=Double.parseDouble(s); */
    </script>
</body>
</html>
文章标签：
前端开发
瑶大头*^_^*
目录
相关文章
瑶大头*^_^*
|
前端开发
JavaWeb11(查看订单详情&优化结算)
JavaWeb11(查看订单详情&优化结算)
瑶大头*^_^*
61 0
一个风轻云淡
订单服务：订单流程
订单服务：订单流程
一个风轻云淡
417 0
日星月云
|
SQL 前端开发
创建订单【项目 商城】
创建订单【项目 商城】
日星月云
60 0
瑶大头*^_^*
JavaWeb10(实现结算&查看订单&订单详情)（一）
JavaWeb10(实现结算&查看订单&订单详情)
瑶大头*^_^*
93 0
winx_19970108018
|
XML JSON 缓存
Java实现订单ID获取淘宝买到的订单详情数据接口方法
Java实现订单ID获取淘宝买到的订单详情数据接口方法
winx_19970108018
359 0
一个风轻云淡
|
前端开发 JavaScript
商城业务：商品详情
商城业务：商品详情
一个风轻云淡
152 0
WBKJ_Noah18870292986
|
数据可视化 搜索推荐 API
如何通过拼多多订单API接口获取订单详情
拼多多订单接口获取到订单详情之后，你可以根据需求对订单信息进行处理和利用，例如： 将订单信息导入到 ERP 系统中实现自动化订单处理； 根据订单信息生成发货单、物流面单等相关文档； 对订单的商品信息进行分析，例如常购买的商品、下单时间、下单地点等，为业务决策提供参考； 根据买家信息进行个性化营销，为买家提供更好的购物体验； 对订单信息进行可视化展示，例如订单量趋势图、订单来源分析等，为业务和数据分析提供支持。 以上只是一些简单的示例，具体使用方式应根据实际业务需求和场景而定。需要注意的是，对于涉及用户隐私数据的处理，需要遵守相关的法律法规和隐私保护政策。
WBKJ_Noah18870292986
439 0
Onebound19970109110
ERP,仓储系统官方订单详情接口trade.fullinfo.get( 获取单笔交易的详细信息 )
ERP,仓储系统官方订单详情接口trade.fullinfo.get( 获取单笔交易的详细信息 )
Onebound19970109110
97 0
云服务器吧
|
弹性计算
阿里云存在未支付订单导致无法下单解决方法
解决阿里云存在未支付订单请支付或作废后再下单，阿里云服务器或其他云资源无法立即购买，提示“您选择的资源存在未支付订单，请支付或作废后再下单！”什么原因？这是由于你的阿里云账号之前已经创建了该订单，只是订单没有支付，所以无法再次创建订单。解决方法是，要么取消之前的订单，要么支付之前的订单。阿里云百科来详细说下阿里云账号下存在未支付订单的解决方法：
云服务器吧
1001 0
阿里云存在未支付订单导致无法下单解决方法
云课程笔记
|
消息中间件 算法 Java
创建支付订单实现|学习笔记
快速学习创建支付订单实现
云课程笔记
127 0
创建支付订单实现|学习笔记