(一)支付流程:去结算(生成定单号)和 解决 提交订单页面 :商品总数 和 商品列表刷新后 数据消失问题

186 阅读1分钟

去结算 流程图 问题那里:老师也是用query传参 不知道为什么不教 可能觉得麻烦吧,也就那样

支付流程(去结算生成订单号).png

前端代码:

 // 点击去结算:
    async goSettlement() {
      // console.log(this.selectList, "dadfdsfas");
      // 判断商品选中后才跳转
      if (!this.selectList.length) {
        Toast("请选择商品");
        console.log(this.selectList);
        return;
      }

      //  被选中的商品 用于结算
      let arrList = this.list.filter((v) => {
        return v.checked == true;
      });
      console.log(arrList);
      // 发送请求:
      let res = await http.$axios({
        method: "POST",
        url: "api/goodsCode",
        // 前端发请求带上 headers,参数为token
        headers: {
          token: true,
        },
        data: [...arrList],
      });
      // 后端返回的订单号 保存到vuex中
      this.order_Code(res.data.orderCode);
      // 跳转到提交订单页
      this.$router.push({
        name: "Settlement",
        query: {
          data: JSON.stringify(this.selectList),
          // total: this.total,
          total: JSON.stringify(this.total),
          order_list: JSON.stringify([...arrList]),
          // order_list: [...arrList],
        },
      });
    },
    

后端代码:

// 生成订单号
router.post('/api/goodsCode', function (req, res, next) {
  // 获取前端传来的数据
  let arrList = req.body
  console.log(arrList, '123456');
  // 订单号生成:年月日时分秒 + 6位随机数
  // 零填充 函数
  function zeroFill(s) {
    return s < 10 ? "0" + s : s
  }

  // 6位随机数
  let num = Math.round(Math.random() * 1000000)
  // 获取年月日时分秒
  function getData() {
    let data = new Date()
    let y = data.getFullYear()
    let m = data.getMonth() + 1
    let d = data.getDate()
    let t = data.getHours()
    let mm = data.getMinutes()
    let s = data.getSeconds()
    m = zeroFill(m)
    d = zeroFill(d)
    t = zeroFill(t)
    mm = zeroFill(mm)
    s = zeroFill(s)
    return y + m + d + t + mm + s + num
  }
  let order_id = getData()
  console.log(order_id, "order_id2");
  // 将数据写入数据库
  let ordersName = []
  // 商品总数量
  let orderTotalNun = 0
  // 商品总价
  let orderTotalPrice = 0
  arrList = arrList.forEach(item => {
    ordersName.push(item.shop_title);
    orderTotalNun += parseInt(item.num)
    orderTotalPrice += item.shop_price * item.num
  })
  console.log(ordersName, orderTotalPrice, orderTotalNun, 'fasdfasdfa');


  // 前端传递过来的token,解析token
  let tokens = req.headers.token;
  let tokenObj = jwt.decode(tokens) //结果 { tel: '18666554444', iat: 1628506659 }
  // console.log(tokenObj.tel, "当前用户手机号");
  if (tokenObj == null) {
    res.send({
      data: {
        code: 400,
        success: false,
        msg: '请先登录'
      }
    })
  } else {
    // 根据token解析出来的手机号,来查询对应的用户表,查到对应的用户
    connection.query(`select * from user where tel ="${tokenObj.tel}"`, function (e, r) {
      if (r) {
        let uid = r[0].id // 最为新表的 uid
        console.log(order_id);

        // 将提交的订单 插入到数据库中
        connection.query(`insert into order_pay (uid,order_id, order_name,order_total_price, order_total_num,order_status)  
        values ("${uid}","${order_id}","${ordersName}","${orderTotalPrice}","${orderTotalNun}","1")`, function (e, resultes) {
          if (resultes) {
            console.log(order_id, "order_id1");
            // 查询提交的订单信息
            console.log(`select * from order_pay where uid="${uid}" order_id = "${order_id}"`, 1111);
            connection.query(`select * from order_pay where uid="${uid}" and order_id = "${order_id}"`, function (e, r) {
              if (r) {
                res.send({
                  data: {
                    msg: "订单号返回成功",
                    data: {
                      orderCode: r,
                      success: true,
                    }
                  }
                })
              }
            })
          }
        })
      }
    })
  }
})

表结构

image.png

跳转之前的图 去结算

image.png

跳转之后的图 提交订单页

image.png