import {
|
reqOrderAddress,
|
reqOrderInfo,
|
reqBuyNowGoods,
|
reqSubmitOrder,
|
reqPrePayInfo,
|
reqPayStatus
|
} from '../../../api/orderpay'
|
// 导入 async-validator 对参数进行验证
|
import Schema from 'async-validator'
|
// 导入格式化时间的方法
|
import { formatTime } from '../../../utils/formatTime'
|
|
|
// 获取应用实例
|
const app = getApp()
|
|
Page({
|
data: {
|
buyName: '', // 订购人姓名
|
buyPhone: '', // 订购人手机号
|
deliveryDate: '', // 期望送达日期
|
blessing: '', // 祝福语
|
show: false, // 期望送达日期弹框
|
orderAddress: {}, // 收货地址
|
orderInfo: {}, // 订单商品详情
|
minDate: new Date().getTime()
|
},
|
|
// 处理提交订单
|
submitOrder: wx.$_.debounce(async function () {
|
// 需要从 data 中解构数据
|
const {
|
buyName,
|
buyPhone,
|
deliveryDate,
|
blessing,
|
orderAddress,
|
orderInfo
|
} = this.data
|
|
// 需要根据接口要求组织请求参数
|
const params = {
|
buyName,
|
buyPhone,
|
cartList: orderInfo.cartVoList,
|
deliveryDate,
|
remarks: blessing,
|
userAddressId: orderAddress.id
|
}
|
|
// 对请求参数进行验证
|
const { valid } = await this.validatorPerson(params)
|
|
// 如果请求参数验证失败,直接 return ,不执行后续的逻辑
|
if (!valid) return
|
|
// 调用接口,创建平台订单
|
const res = await reqSubmitOrder(params)
|
|
if (res.code === 200) {
|
// 在平台订单创建成功以后,需要将服务器、后端返回的订单编号挂载到页面实例上
|
this.orderNo = res.data
|
|
// 获取预付单信息、支付参数
|
this.advancePay()
|
}
|
}, 500),
|
|
// 获取预付单信息、支付参数
|
async advancePay() {
|
try {
|
const payParams = await reqPrePayInfo(this.orderNo)
|
|
if (payParams.code === 200) {
|
// payParams.data 就是获取的支付参数
|
|
// 调用 wx.requestPayment 发起微信支付
|
const payInfo = await wx.requestPayment(payParams.data)
|
|
// 获取支付的结果
|
if (payInfo.errMsg === 'requestPayment:ok') {
|
// 查询支付的状态
|
const payStatus = await reqPayStatus(this.orderNo)
|
|
if (payStatus.code === 200) {
|
wx.redirectTo({
|
url: '/modules/orderPayModule/pages/order/list/list',
|
success: () => {
|
wx.toast({
|
title: '支付成功',
|
icon: 'success'
|
})
|
}
|
})
|
}
|
}
|
}
|
} catch (error) {
|
wx.toast({
|
title: '支付失败',
|
icon: 'error'
|
})
|
}
|
},
|
|
// 对收货人、订购人信息进行验证
|
validatorPerson(params) {
|
// 验证订购人,是否只包含大小写字母、数字和中文字符
|
const nameRegExp = '^[a-zA-Z\\d\\u4e00-\\u9fa5]+$'
|
|
// 验证订购人手机号,是否符合中国大陆手机号码的格式
|
const phoneReg = '^1(?:3\\d|4[4-9]|5[0-35-9]|6[67]|7[0-8]|8\\d|9\\d)\\d{8}$'
|
|
// 创建验证规则
|
const rules = {
|
userAddressId: {
|
required: true,
|
message: '请选择收货地址'
|
},
|
buyName: [
|
{ required: true, message: '请输入订购人姓名' },
|
{ pattern: nameRegExp, message: '订购人姓名不合法' }
|
],
|
buyPhone: [
|
{ required: true, message: '请输入订购人手机号' },
|
{ pattern: phoneReg, message: '订购人手机号不合法' }
|
],
|
deliveryDate: { required: true, message: '请选择送达日期' }
|
}
|
|
// 传入验证规则进行实例化
|
const validator = new Schema(rules)
|
|
// 调用实例方法对请求参数进行验证
|
// 注意:我们希望将验证结果通过 Promise 的形式返回给函数的调用者
|
return new Promise((resolve) => {
|
validator.validate(params, (errors) => {
|
if (errors) {
|
// 如果验证失败,需要给用户进行提示
|
wx.toast({ title: errors[0].message })
|
// 如果属性值是 false,说明验证失败
|
resolve({ valid: false })
|
} else {
|
// 如果属性值是 true,说明验证成功
|
resolve({ valid: true })
|
}
|
})
|
})
|
},
|
|
// 选择期望送达日期
|
onShowDateTimerPopUp() {
|
this.setData({
|
show: true
|
})
|
},
|
|
// 期望送达日期确定按钮
|
onConfirmTimerPicker(event) {
|
// 使用 Vant 提供的时间选择组件,获取的时间是时间戳
|
// 需要将时间戳转换成年月日在页面中进行展示才可以
|
// 可以调用小程序给提供的日期格式化方法对时间进行转换
|
// console.log(event.detail)
|
|
// formatTime 方法接收 JS 的日期对象作为参数
|
// 因此需要将时间戳转换成 JS 的日期对象
|
const timeRes = formatTime(new Date(event.detail))
|
|
this.setData({
|
show: false,
|
deliveryDate: timeRes
|
})
|
},
|
|
// 期望送达日期取消按钮 以及 关闭弹框时触发
|
onCancelTimePicker() {
|
this.setData({
|
show: false,
|
minDate: new Date().getTime(),
|
currentDate: new Date().getTime()
|
})
|
},
|
|
// 跳转到收货地址
|
toAddress() {
|
wx.navigateTo({
|
url: '/modules/settingModule/pages/address/list/index'
|
})
|
},
|
|
// 获取订单页面的收货地址
|
async getAddress() {
|
// 判断全局共享的 address 中是否存在数据,
|
// 如果存在数据,就需要从全局共享的 address 中取到数据进行赋值
|
const addressId = app.globalData.address.id
|
|
if (addressId) {
|
this.setData({
|
orderAddress: app.globalData.address
|
})
|
|
return
|
}
|
|
// 如果全局共享的 address 中没有数据,就需要调用接口获取收货地址数据进行渲染
|
const { data: orderAddress } = await reqOrderAddress()
|
|
this.setData({
|
orderAddress
|
})
|
},
|
|
// 获取订单详情数据
|
async getOrderInfo() {
|
const { goodsId, blessing } = this.data
|
|
const { data: orderInfo } = goodsId
|
? await reqBuyNowGoods({ goodsId, blessing })
|
: await reqOrderInfo()
|
|
// 判断是否存在祝福语
|
// 如果需要购买的是多个商品,筛选第一个存在祝福语的商品进行赋值
|
const orderGoods = orderInfo.cartVoList.find((item) => item.blessing !== '')
|
|
this.setData({
|
orderInfo,
|
blessing: !orderGoods ? '' : orderGoods.blessing
|
})
|
},
|
|
// 在页面加载的时候触发
|
onLoad(options) {
|
// 获取立即购买商品传递的参数
|
// 然后把参数赋值给 data 中的状态
|
this.setData({
|
...options
|
})
|
},
|
|
// 在页面展示的时候进行触发
|
onShow() {
|
// 获取收货地址
|
this.getAddress()
|
|
// 获取需要下单商品的详细信息
|
this.getOrderInfo()
|
},
|
|
onUnload() {
|
// 在页面销毁以后,需要将全局共享的 address 也进行重置
|
// 如果用户再次进入结算支付页面,需要从接口地址获取默认的收货地址进行渲染
|
// 需要和产品多沟通
|
app.globalData.address = {}
|
}
|
})
|