feat: 商品下单完成

2025-12-01 18:31:22 +08:00 · 2025-12-01 18:31:22 +08:00 · 0ac6b869bf
commit 0ac6b869bf
parent bcff31ba7f
6 changed files with 162 additions and 137 deletions
--- a/api/checkout.js
+++ b/api/checkout.js
@ -10,6 +10,7 @@ const api = {

 // 结算台订单信息
 export const order = (mode, param) => {
+    console.warn('----- my data is { mode, ...param }: ', { mode, ...param })
  return request.get(api.order, { mode, ...param })
 }

--- a/api/order.js
+++ b/api/order.js
@ -1,4 +1,6 @@
 import request from '@/utils/request'
+import {httpRequest} from '@/utils/request/axios'
+const baseUrl = 'https://api.1024api.com/api-interface/app'

 // api地址
 const api = {
@ -40,3 +42,19 @@ export function cancel(orderId, data) {
 export function receipt(orderId, data) {
  return request.post(api.receipt, { orderId, ...data })
 }
+
+// 获取地理位置
+export const apiGetAddressList = (data) => {
+    return httpRequest.post(
+      `${baseUrl}/buyer/address/list`,
+      data
+    );
+  }
+
+// 下单
+export const apiOrderAdd = (data) => {
+    return httpRequest.post(
+      `${baseUrl}/order/add`,
+      data
+    );
+  }
--- a/components/goods-sku-popup/index.vue
+++ b/components/goods-sku-popup/index.vue
@ -801,7 +801,7 @@
        let that = this;
        that.checkSelectComplete({
          success: function(selectShop) {
-            console.warn('----- my data is : ', selectShop)
+            console.warn('----- my data is 111: ', selectShop)
            selectShop.buy_num = that.selectNum;
            that.$emit('buy-now', selectShop);
            that.$emit('buy', selectShop);
--- a/config.js
+++ b/config.js
@ -8,7 +8,8 @@ export default {
   * 例如: https://www.你的域名.com/index.php?s=/api/
   */
 //   apiUrl: "https://shop2.client.yiovo.com/index.php?s=/api/", // 微信小程序
-  apiUrl: "/index.php?s=/api/", // H5
+//   apiUrl: "/index.php?s=/api/", // H5
+  apiUrl: "http://127.0.0.1:4523/m1/7488507-7223875-default/index.php?s=/api/", // mock

  /**
   * 是否启用商城设置缓存
--- a/pages/checkout/index.vue
+++ b/pages/checkout/index.vue
@ -1,18 +1,18 @@
 <template>
  <view class="container p-bottom" :style="appThemeStyle">
-    <view v-if="order.goodsList && order.goodsList.length">
+    <view>
      <!-- 实物订单：选择配送方式 -->
-      <block v-if="order.orderType == OrderTypeEnum.PHYSICAL.value">
+      <view>
        <!-- 配送方式选项卡 -->
-        <view v-if="isShowTab" class="swiper-tab dis-flex flex-y-center flex-x-around">
+       <!--  <view class="swiper-tab dis-flex flex-y-center flex-x-around">
          <view class="swiper-tab-item" :class="{ on: curDelivery == DeliveryTypeEnum.EXPRESS.value }"
            @click="handleSwichDelivery(DeliveryTypeEnum.EXPRESS.value)">
            <text>快递配送</text>
          </view>
-        </view>
+        </view> -->

        <!-- 快递配送：配送地址 -->
-        <view v-if="curDelivery == DeliveryTypeEnum.EXPRESS.value" @click="onSelectAddress" class="flow-delivery">
+        <view @click="onSelectAddress" class="flow-delivery">
          <view class="flow-delivery__detail dis-flex flex-y-center">
            <view class="detail-location dis-flex">
              <text class="iconfont icon-dingwei"></text>
@ -20,8 +20,8 @@
            <view class="detail-content flex-box">
              <block v-if="order.address">
                <view class="detail-content__title dis-flex">
-                  <text class="f-30">{{ order.address.name }}</text>
-                  <text class="detail-content__title-phone f-28">{{ order.address.phone }}</text>
+                  <text class="f-30">{{ order.address.buyerName }}</text>
+                  <text class="detail-content__title-phone f-28">{{ order.address.buyerPhone }}</text>
                </view>
                <view class="address detail-content__describe">
                  <text class="region" v-for="(region, idx) in order.address.region" :key="idx">{{ region }}</text>
@ -40,18 +40,18 @@
          </view>
        </view>

-      </block>
+      </view>

      <!-- 商品列表 -->
      <view class="checkout_list" v-for="(item, index) in order.goodsList" :key="index">
-        <view class="flow-shopList dis-flex" data-index="index" @click="onTargetGoods(item.goods_id)">
+        <view class="flow-shopList dis-flex" data-index="index" @click="onTargetGoods(item.goodsId)">
          <!-- 商品图片 -->
          <view class="flow-list-left">
-            <image mode="scaleToFill" :src="item.goods_image"></image>
+            <image mode="scaleToFill" :src="item.image"></image>
          </view>
          <view class="flow-list-right flex-box">
            <!-- 商品名称 -->
-            <text class="goods-name twoline-hide">{{ item.goods_name }}</text>
+            <text class="goods-name twoline-hide">{{ item.title }}</text>
            <!-- 商品规格 -->
            <view class="goods-props clearfix">
              <view class="goods-props-item" v-for="(props, idx) in item.skuInfo.goods_props" :key="idx">
@ -61,12 +61,12 @@
            </view>
            <!-- 商品数量和单价 -->
            <view class="flow-list-cont dis-flex flex-x-between flex-y-center">
-              <text class="small">×{{ item.total_num }}</text>
-              <text class="flow-cont" :class="[item.is_user_grade ? 'price-delete' : '']">￥{{ item.goods_price }}</text>
+              <text class="small">×{{ item.buy_num }}</text>
+              <text class="flow-cont" :class="[item.is_user_grade ? 'price-delete' : '']">￥{{ item.price }}</text>
            </view>
            <!-- 会员折扣价 -->
            <view v-if="item.is_user_grade" class="grade-price">
-              <text>会员折扣价：￥{{ item.grade_goods_price }}</text>
+              <text>会员折扣价：￥{{ 0 }}</text>
            </view>
          </view>
        </view>
@ -86,7 +86,7 @@
          </view>
        </view>
        <!-- 优惠券 -->
-        <view v-if="$checkModule('market-coupon')" class="flow-all-list dis-flex">
+        <view class="flow-all-list dis-flex">
          <text class="flex-five">优惠券：</text>
          <view class="flex-five t-r">
            <view v-if="order.couponList.length > 0" @click="handleShowPopup()">
@ -98,7 +98,7 @@
          </view>
        </view>
        <!-- 积分抵扣 -->
-        <view v-if="$checkModule('market-points') && order.isAllowPoints" class="points flow-all-list dis-flex flex-y-center">
+        <!-- <view v-if="order.isAllowPoints" class="points flow-all-list dis-flex flex-y-center">
          <view class="block-left flex-five" @click="handleShowPoints()">
            <text class="title">可用{{ setting.points_name }}抵扣：</text>
            <text class="iconfont icon-help"></text>
@ -107,18 +107,15 @@
            <text class="points-money col-m">-￥{{ order.pointsMoney }}</text>
            <u-switch v-model="isUsePoints" size="42" :active-color="appTheme.mainBg" @change="getOrderData()"></u-switch>
          </view>
-        </view>
+        </view> -->
        <!-- 配送费用 -->
        <view v-if="curDelivery == DeliveryTypeEnum.EXPRESS.value" class="dis-flex flow-all-list">
          <text class="flex-five">配送费用：</text>
          <view class="flex-five t-r">
-            <view v-if="order.address">
-              <text class="col-m" v-if="order.isIntraRegion">+￥{{ order.expressPrice }}</text>
+            <view>
+              <text class="col-m" v-if="!order.isIntraRegion">+￥{{ 0 }}</text>
              <text v-else>不在配送范围</text>
            </view>
-            <view v-else>
-              <text class="col-7">请先选择配送地址</text>
-            </view>
          </view>
        </view>
      </view>
@ -134,7 +131,7 @@
      <view class="flow-fixed-footer b-f m-top10">
        <view class="dis-flex chackout-box">
          <view class="chackout-left pl-12">实付款：
-            <text class="col-m">￥{{ order.orderPayPrice }}</text>
+            <text class="col-m">￥{{ order.orderTotalPrice }}</text>
          </view>
          <view class="chackout-right" @click="onSubmitOrder()">
            <view class="flow-btn f-32" :class="{ disabled }">提交订单</view>
@ -225,8 +222,8 @@
 </template>

 <script>
-  import * as Verify from '@/utils/verify'
  import * as CheckoutApi from '@/api/checkout'
+  import * as OrderApi from '@/api/order'
  import { CouponTypeEnum } from '@/common/enum/coupon'
  import { OrderTypeEnum, DeliveryTypeEnum } from '@/common/enum/order'

@ -267,9 +264,9 @@
        // 当前页面参数
        options: {},
        // 配送方式
-        isShowTab: false,
+        // isShowTab: false,
+        curDelivery: 10,
        DeliveryTypeEnum,
-        curDelivery: null,
        // 优惠券颜色组
        CouponColors,
        // 选择的优惠券
@ -285,9 +282,9 @@
        // 是否显示优惠券弹窗
        showPopup: false,
        // 订单信息 (从后端api中获取)
-        order: {},
-        // 个人信息
-        personal: {},
+        order: {
+            couponList: [],
+        },
        // 商城设置
        setting: {}
      }
@ -312,45 +309,95 @@
     */
    onShow() {
      // 获取当前订单信息
-      this.getOrderData()
+      const goods = JSON.parse(decodeURIComponent(this.options.goods))
+      console.warn('----- my data is goods: ', goods)
+      goods.forEach(item => {
+        item.skuInfo = { goods_props: [] }
+      })
+      this.order.goodsList = goods
+    //   this.getOrderData()
+      OrderApi.apiGetAddressList({}).then(res => {
+        const ob = this.order.address = res.data.rows.find(item => item.status === 'default') || {}
+        this.order.address.region = [ob.province, ob.city, ob.region]
+        this.order.couponList = []
+        this.order.orderTotalPrice = goods.reduce((total, item) => total + item.price * item.buy_num, 0)
+        this.order.orderTotalNum = goods.reduce((total, item) => total + item.buy_num, 0)
+      })
    },

    methods: {
-
-      // 获取订单数据
-      getOrderData() {
-        const app = this
-        const { options: { mode } } = app
-        // 请求的参数
-        const params = app.getRequestParam()
-        // 请求api
-        getCheckoutApi(mode)
-          .order(mode, params)
-          .then(result => app.initData(result.data))
-          .catch(err => err)
+      // 快递配送：选择收货地址
+      onSelectAddress() {
+        this.$navTo('pages/address/index', { from: 'checkout' })
      },

-      // 初始化数据
-      initData({ order, setting, personal }) {
+      // 跳转到商品详情页
+      onTargetGoods(goodsId) {
+        this.$navTo('pages/goods/detail', { goodsId })
+      },
+
+      // 订单提交
+      onSubmitOrder() {
        const app = this
-        app.order = order
-        app.personal = personal
-        app.setting = setting
-        // 显示错误信息
-        if (order.hasError) {
-          app.showToast(order.errorMsg, 3000)
+        if (app.disabled) {
+          return false
        }
-        // 当前选择的配送方式
-        app.curDelivery = order.delivery
-        // 如果只有一种配送方式则不显示选项卡
-        app.isShowTab = setting.deliveryType.length > 1
-        // 是否使用积分抵扣
-        app.isUsePoints = order.isUsePoints
-        app.selectCouponId = order.couponId
+        // 表单验证
+        if (!app.onVerifyFrom()) {
+          return false
+        }
+        // 按钮禁用
+        app.disabled = true
+        const skuList = app.order.goodsList.map(item => ({
+          skuId: item.goodsSkuId,
+          num: item.buy_num,
+        }))
+        OrderApi.apiOrderAdd({ buyerAddressId: this.order.address.id, vvTradeOrderLineDTOList: skuList }).then(res => {
+            res.data.package = res.data.prepayId
+            res.data.timeStamp = String(res.data.timeStamp)
+            // 判断订单是否已支付: 已支付跳转订单列表  未支付跳转支付页
+            if (!res.data.package) {
+              app.showToast(result.message, 1500)
+              setTimeout(() => app.$navTo('pages/order/index', {}, 'redirectTo'), 1500)
+            } else {
+              // 订单未支付: 跳转到订单支付页
+              setTimeout(() => app.$navTo('pages/checkout/cashier/index', res.data, 'redirectTo'), 100)
+            }
+        }).finally(() => setTimeout(() => app.disabled = false, 1600))
      },

-      // 获取api请求的参数
-      getRequestParam() {
+      // 表单提交的数据
+      getFormData() {
+        const app = this
+        const { options } = app
+        // 表单数据
+        const form = {
+          delivery: app.curDelivery,
+          couponId: app.selectCouponId || 0,
+          isUsePoints: app.isUsePoints ? 1 : 0,
+          remark: app.remark || '',
+        }
+        // 获取不同模式的参数
+        const modeParam = getModeParam(options.mode, options)
+        return { ...form, ...modeParam }
+      },
+
+      // 表单验证
+      onVerifyFrom() {
+        const app = this
+        if (app.hasError) {
+          app.showToast(app.errorMsg, 3000)
+          return false
+        }
+        return true
+      },
+
+      // 显示toast信息
+      showToast(title, duration = 2000) {
+        this.$refs.uToast.show({ title, duration })
+      },
+       // 获取api请求的参数
+       getRequestParam() {
        const app = this
        const { options } = app
        // 结算模式的固定参数
@ -363,9 +410,33 @@
        }
        return { ...orderParam, ...modeParam }
      },
+      
+      // 获取订单数据
+      getOrderData() {
+        const app = this
+        const { options: { mode } } = app
+        const params = app.getRequestParam()
+        getCheckoutApi(mode)
+          .order(mode, params)
+          .then(result => app.initData(result.data))
+          .catch(err => err)
+      },

+      // 初始化数据
+      initData({ order, setting }) {
+        const app = this
+        app.order = order
+        app.setting = setting
+        // 当前选择的配送方式
+        // app.curDelivery = order.delivery
+        // app.isShowTab = setting.deliveryType.length > 1 // 如果只有一种配送方式则不显示选项卡
+        // 是否使用积分抵扣
+        // app.isUsePoints = order.isUsePoints
+        app.selectCouponId = order.couponId
+      },
+      
      // 切换配送方式
-      handleSwichDelivery(key) {
+    /*   handleSwichDelivery(key) {
        this.curDelivery = key
        this.getOrderData()
      },
@ -373,7 +444,7 @@
      // 显示积分抵扣说明
      handleShowPoints() {
        this.showPoints = true
-      },
+      }, */

      // 显示优惠券弹窗
      handleShowPopup() {
@ -414,77 +485,6 @@
        this.showPopup = false
      },

-      // 快递配送：选择收货地址
-      onSelectAddress() {
-        this.$navTo('pages/address/index', { from: 'checkout' })
-      },
-
-      // 跳转到商品详情页
-      onTargetGoods(goodsId) {
-        this.$navTo('pages/goods/detail', { goodsId })
-      },
-
-      // 订单提交
-      onSubmitOrder() {
-        const app = this
-        if (app.disabled) {
-          return false
-        }
-        // 表单验证
-        if (!app.onVerifyFrom()) {
-          return false
-        }
-        // 按钮禁用
-        app.disabled = true
-        // 请求api
-        getCheckoutApi(app.options.mode)
-          .submit(app.options.mode, app.getFormData())
-          .then(result => {
-            // 订单创建成功
-            const orderId = result.data.orderId
-            // 判断订单是否已支付: 已支付跳转订单列表  未支付跳转支付页
-            if (result.data.isPaySuccess) {
-              app.showToast(result.message, 1500)
-              setTimeout(() => app.$navTo('pages/order/index', {}, 'redirectTo'), 1500)
-            } else {
-              // 订单未支付: 跳转到订单支付页
-              setTimeout(() => app.$navTo('pages/checkout/cashier/index', { orderId }, 'redirectTo'), 100)
-            }
-          })
-          .catch(res => app.showToast(res.errMsg, 3000))
-          .finally(() => setTimeout(() => app.disabled = false, 1600))
-      },
-
-      // 表单提交的数据
-      getFormData() {
-        const app = this
-        const { options } = app
-        // 表单数据
-        const form = {
-          delivery: app.curDelivery,
-          couponId: app.selectCouponId || 0,
-          isUsePoints: app.isUsePoints ? 1 : 0,
-          remark: app.remark || '',
-        }
-        // 获取不同模式的参数
-        const modeParam = getModeParam(options.mode, options)
-        return { ...form, ...modeParam }
-      },
-
-      // 表单验证
-      onVerifyFrom() {
-        const app = this
-        if (app.hasError) {
-          app.showToast(app.errorMsg, 3000)
-          return false
-        }
-        return true
-      },
-
-      // 显示toast信息
-      showToast(title, duration = 2000) {
-        this.$refs.uToast.show({ title, duration })
-      }

    }
  }
--- a/pages/goods/components/SkuPopup.vue
+++ b/pages/goods/components/SkuPopup.vue
@ -145,11 +145,16 @@
      buyNow(selectShop) {
        // 跳转到订单结算页
        this.$navTo('pages/checkout/index', {
-          mode: 'buyNow',
+            mode: 'buyNow',
+          goods: encodeURIComponent(JSON.stringify([{
          goodsId: selectShop.goods_id,
          goodsSkuId: selectShop.goods_sku_id,
-          goodsNum: selectShop.buy_num
-        })
+          goodsNum: selectShop.buy_num,
+          title: selectShop.goods_name,
+          image: selectShop.image,
+          price: selectShop.price,
+          buy_num: selectShop.buy_num
+         }]))})
        // 隐藏当前弹窗
        this.onChangeValue(false)
      }