这是界面,想要实现点击提交订单,订单编号自动生成,然后跳出微信支付,付款成功后这个界面所有的数据上传到数据库里,要怎样写代码呢?
下面是我写的一部分,求指点,谢谢
wxml
<view class="content"wx:key='xinxi1' >
<view class="demo-text-1" >*</view>
<view class="demo-text-2"> 姓名:</view>
<view class="demo-text-3" ><input placeholder="请输入姓名" bindinput="getname" > </input> </view>
<view class="demo-text-4" > </view>
</view>
<view class="content">
<view class="demo-text-1" >*</view>
<view class="demo-text-2" >电话:</view>
<view class="demo-text-3" ><input placeholder="请输入电话" bindinput="getphone"> </input> </view>
<view class="demo-text-4" > </view>
</view>
<view class="content">
<view class="demo-text-1" >*</view>
<view class="demo-text-2" > 位置:</view>
<view class="demo-text-3" >
<text bindtap="getUserLocation" >{{address}}</text>
</view>
<view class="demo-text-4" >
<button class="imgtb"style="background-image:url(https://7179-qyww-umgn9-1301480214.tcb.qcloud.la/img/marker_red.png?sign=4c58fdb6ffde9ef6045dba095df1b78e&t=1583974406);" bindtap="getditu" plain="true"></button>
</view>
</view>
<view class="content">
<view class="demo-text-1" >*</view>
<view class="demo-text-2" >详细地址:</view>
<view class="demo-text-3" ><input placeholder="详细小区单元楼及门牌号" bindinput="getxiangxi"> </input> </view>
</view>
<view class="content">
<view class="demo-text-1" >*</view>
<view class="demo-text-2" >备注:</view>
<view class="demo-text-3" ><input placeholder="备注留言信息" bindinput="getbeizhu"> </input> </view>
</view>
<view class='product-container'>
<block wx:for="{{product1_list}}" wx:key="">
<view class="product-item">
<view class="item-left">
<image src="{{item.product_img}}"></image>
</view>
<view class="item-middle">
<view>{{item.product_name}}</view>
<view>¥{{item.product_sell_price}}</view>
</view>
<view class="item-right">
×{{item.product_count}}
</view>
</view>
</block>
</view>
<view class='order-container'>
<view class='order-remarks'>
<view class='details'>
<text>订单编号:</text>
<text>{{GoodsRandomNumber}}</text>
</view>
<view class='details'>
<text>注意事项:</text>
<text>购买前请仔细阅读服务详情</text>
</view>
<view class='details'>
<text>服务类型:</text>
<text>30天服务预约定金</text>
</view>
<view class='details'>
<text>服务时间:</text>
<text>收到通知20点前支付尾款次日服务,20点后支付隔日服务</text>
</view>
</view>
<view class="order_pay"wx:for="{{product1_list}}">
<view class="pay_money">付款 <text class="Total_price">¥{{item.product_account}}</text></view>
<view class="submit_order" bindtap="bindSubmitOrder">提交订单</view>
</view>
</view>
//index.js
//获取应用实例
const app = getApp();
console.log(app.globalData.openid)
const db = wx.cloud.database({});
// 引入SDK核心类
var QQMapWX = require('../../utils/qqmap-wx-jssdk1.2/qqmap-wx-jssdk');
// 实例化API核心类
var demo = new QQMapWX({
key: '' // 必填
});
Page({
data: {
address:'点击获取位置信息',
name:'',phone:'',address:[],xiangxi:'',beizhu:'',
orderStatus:'0',
product1_list:'',
product1_list:[],
GoodsRandomNumber:''
},
onLoad: function() {
// 创建一个变量来保存页面page示例中的this, 方便后续使用
db.collection('product1').get({
success: res =>{
console.log(res.data[0]);
this.setData({
product1_list:res.data,})
}
})
wx.getStorage(
{
key:'xinxi1',
success:function(res)
{console.log(res.data)//Object {errMsg: "getStorage:ok", data: "value1"}
},
fail:function(res){console.log(res)},
complete:function(res){console.log(res)}
})
},
getditu:function(){
var me = this;
// 地理位置
wx.getLocation({
type: 'wgs84',
success(res) {
console.log(res)
// 调用接口转换成具体位置
demo.reverseGeocoder({
location: {
latitude: res.latitude,
longitude: res.longitude
},
success: function (res) {
console.log('位置获取成功',res.result)
me.setData({
address:res.result.address
})
},
fail: function (res) {
console.log(res);
},
})
}
})
},
/**
*获取用户当前地理位置
*/
getUserLocation() {
var that = this
wx.chooseLocation({
success: function (res) {
console.log(res)
that.setData({
latitude2: res.latitude,
longitude2: res.longitude,
name: res.name,
address: res.address
})
},
fail: function () {
// fail
},
complete: function () {
// complete
}
})
}, // 随机生成商品订单号,订单号不能重复
getGoodsRandomNumber:function(event) {
const date = new Date(); // 当前时间
this.setData({
GoodsRandomNumber:res.GoodsRandomNumber
})
let Year = `${date.getFullYear()}`; // 获取年份
let Month = `${
date.getMonth() + 1 < 10 ? `0${date.getMonth() + 1}` : date.getMonth() + 1
}`; // 获取月
let Day = `${date.getDate() < 10 ? `0${date.getDate()}` : date.getDate()}`; // 获取天
let hour = `${
date.getHours() < 10 ? `0${date.getHours()}` : date.getHours()
}`; // 获取小时
let min = `${
date.getMinutes() < 10 ? `0${date.getMinutes()}` : date.getMinutes()
}`; // 获取分钟
let sec = `${
date.getSeconds() < 10 ? `0${date.getSeconds()}` : date.getSeconds()
}`; // 获取秒
let formateDate = `${Year}${Month}${Day}${hour}${min}${sec}`; // 时间
let GoodsRandomNumber=`${Math.round(Math.random() * 1000)}${formateDate +
Math.round(Math.random() * 89 + 100).toString()}`;
console.log(GoodsRandomNumber)
return GoodsRandomNumber
},
getname:function(event){
this.setData({
name:event.detail.value
})
},
getphone:function(event){
this.setData({
phone:event.detail.value
})
},
getxiangxi:function(event){
this.setData({
xiangxi:event.detail.value
})
},
getbeizhu:function(event){
this.setData({
beizhu:event.detail.value
})
},
bindSubmitOrder:function(){
let name=this.data.name
let phone=this.data.phone
let address=this.data.address
let xiangxi=this.data.xiangxi
let beizhu=this.data.beizhu
let product1_list=this.data.product1_list
let orderStatus=this.data.orderStatus
let GoodsRandomNumber=this.data.GoodsRandomNumber
wx.setStorage({key:"xinxi1",data:{name,phone,address,xiangxi,beizhu,GoodsRandomNumber,product1_list}})
console.log("点击了提交")
console.log("name", name)
console.log("phone", phone)
console.log("weizhi",address)
console.log('xiangxi',xiangxi)
console.log('beizhu',beizhu)
console.log(product1_list )
console.log(orderStatus )
console.log(GoodsRandomNumber)
//校验
if(name.length<2){
wx.showToast({
icon:"none",
title: '姓名至少2位!',
})
return
}if(phone.length!=11){
wx.showToast({
icon:"none",
title: '电话号码不正确!',
})
return
}if(xiangxi.length==0){
wx.showToast({
icon:"none",
title: '地址不能为空!',
})
return
}
//信息提交数据库
wx.cloud.database().collection('yyOrder0','Order0').add({
data:{GoodsRandomNumber:GoodsRandomNumber,
product1_list:product1_list,
orderStatus:orderStatus,
name:name,
phone:phone,
address:address,
xiangxi:xiangxi,
beizhu:beizhu,
time:new Date
},
success(res){
console.log('提交成功',res)
wx.showToast({
title: '成功',
}),
wx.navigateTo({
url: '../success/success',
})
},
fail(res){
console.log('提交失败',res)
}
})
wx.cloud.database().collection('Order0').add({
data:{GoodsRandomNumber:GoodsRandomNumber,
product1_list:product1_list,
orderStatus:orderStatus,
name:name,
phone:phone,
address:address,
xiangxi:xiangxi,
beizhu:beizhu,
time:new Date
},
success(res){
console.log('提交成功',res)
wx.showToast({
title: '成功',
}),
wx.navigateTo({
url: '../success/success',
})
},
fail(res){
console.log('提交失败',res)
}
})
},
})