mirror of
https://gitee.com/java110/WechatOwnerService.git
synced 2026-02-23 21:36:38 +08:00
开发完成预约就餐功能
This commit is contained in:
Your Name
parent
a3783df9f4
commit
c328470e35
@ -442,7 +442,10 @@ export function payFeeApp(_that, _data) {
|
||||
* @param {*} _that
|
||||
* @param {*} _data
|
||||
*/
|
||||
export function payFeeWechat(_that, _data) {
|
||||
export function payFeeWechat(_that, _data,_successUrl) {
|
||||
if(!_successUrl ){
|
||||
_successUrl = "/pages/successPage/successPage?msg=支付成功&objType=3003";
|
||||
}
|
||||
wx.showLoading({
|
||||
title: '支付中'
|
||||
});
|
||||
@ -464,7 +467,7 @@ export function payFeeWechat(_that, _data) {
|
||||
'paySign': data.sign,
|
||||
'success': function(res) {
|
||||
uni.navigateTo({
|
||||
url: "/pages/successPage/successPage?msg=支付成功&objType=3003"
|
||||
url: _successUrl
|
||||
})
|
||||
},
|
||||
'fail': function(res) {
|
||||
@ -475,7 +478,7 @@ export function payFeeWechat(_that, _data) {
|
||||
// #ifdef H5
|
||||
WexinPayFactory.wexinPay(data, function() {
|
||||
uni.navigateTo({
|
||||
url: "/pages/successPage/successPage?msg=支付成功&objType=3003"
|
||||
url: _successUrl
|
||||
})
|
||||
});
|
||||
// #endif
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<view class="cu-dialog">
|
||||
<view class="cu-bar bg-white justify-end">
|
||||
<view class="content">{{goods.goodsName}}</view>
|
||||
<view class="action" @tap="_cancleLogout()">
|
||||
<view class="action" @tap="_cancle()">
|
||||
<text class="cuIcon-close text-red"></text>
|
||||
</view>
|
||||
</view>
|
||||
@ -33,7 +33,13 @@
|
||||
</checkbox-group>
|
||||
<!-- -->
|
||||
</view>
|
||||
|
||||
</view>
|
||||
<view class="flex justify-between margin-top">
|
||||
<view>金额</view>
|
||||
<view >
|
||||
<text class="text-red margin-right">￥{{money}}</text>
|
||||
<!-- -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cu-bar bg-white justify-end">
|
||||
@ -64,11 +70,19 @@
|
||||
quantity: "1"
|
||||
},
|
||||
openTimes: [],
|
||||
money:0,
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
reserveGoods: function(_goods) {
|
||||
this.isShow = true;
|
||||
this.goods = {
|
||||
hours: [],
|
||||
quantity: "1"
|
||||
},
|
||||
this.money = 0;
|
||||
this.openTimes = [];
|
||||
|
||||
this._loadGoods(_goods.goodsId);
|
||||
},
|
||||
_cancle: function() {
|
||||
@ -83,8 +97,9 @@
|
||||
goodsId: _goodsId
|
||||
}).then(_data => {
|
||||
_that.goods = _data[0];
|
||||
_that.goods.hours = [],
|
||||
_that.goods.hours = [];
|
||||
_that.goods.quantity = "1"
|
||||
|
||||
_that._loadGoodsParams();
|
||||
})
|
||||
},
|
||||
@ -97,14 +112,22 @@
|
||||
paramsId: this.goods.paramsId
|
||||
}).then(_data => {
|
||||
_that.openTimes = _data[0].openTimes;
|
||||
_that.$forceUpdate();
|
||||
})
|
||||
},
|
||||
_changeReserveTime: function(e) {
|
||||
this.goods.hours = e.detail.value;
|
||||
this._computeMoney();
|
||||
},
|
||||
_changeReserveQuantity: function(e, guid, item) {
|
||||
this._computeMoney();
|
||||
this.goods.quantity = e.detail.value;
|
||||
},
|
||||
_computeMoney:function(){
|
||||
let _quantity = this.goods.hours.length * parseFloat(this.goods.quantity);
|
||||
this.money = (_quantity * parseFloat(this.goods.price)).toFixed(2);
|
||||
this.goods.money = this.money;
|
||||
},
|
||||
_doSummit: function() {
|
||||
if (!this.goods.quantity) {
|
||||
uni.showToast({
|
||||
@ -120,7 +143,8 @@
|
||||
});
|
||||
return;
|
||||
}
|
||||
console.log(this.goods);
|
||||
this.isShow = false;
|
||||
this.$emit('selectGoods',this.goods);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
74
components/reserve/selected-goods.vue
Normal file
74
components/reserve/selected-goods.vue
Normal file
@ -0,0 +1,74 @@
|
||||
<template>
|
||||
<view>
|
||||
<view class="cu-modal bottom-modal" :class="isShowOrderUp?'show':''">
|
||||
<view class="cu-dialog">
|
||||
<view class="cu-bar bg-white ">
|
||||
<view class="action">
|
||||
预约商品
|
||||
</view>
|
||||
<view class="action">
|
||||
<button class="cu-btn line-blue round sm" @click="_closes()">关闭</button>
|
||||
</view>
|
||||
</view>
|
||||
<scroll-view scroll-y style="height: 700upx;">
|
||||
<block>
|
||||
<view>
|
||||
<view class="cu-list menu no-padding">
|
||||
<view class="cu-item " v-for="(items,sub) in goods" :key="sub">
|
||||
<view class="">
|
||||
<view class="text-grey">
|
||||
<text class="text-abc">{{items.goodsName}}({{items.quantity}}次) ￥{{items.money}}</text></view>
|
||||
<view class="text-gray text-sm flex justify-start">
|
||||
<view v-for="(item,index) in items.hours" :key="index">
|
||||
<view>{{item}}时;</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="action">
|
||||
<button class="cu-btn line-red round sm" @click="_delete(items)">删除</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "selectedGoods",
|
||||
data() {
|
||||
return {
|
||||
isShowOrderUp: false,
|
||||
goods: []
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
viewSelectModal: function(_goodsList) {
|
||||
this.isShowOrderUp = true;
|
||||
this.goods = _goodsList;
|
||||
console.log('this.goods', this.goods);
|
||||
},
|
||||
_closes:function(){
|
||||
this.isShowOrderUp = false;
|
||||
},
|
||||
_delete:function(_goods){
|
||||
let _tmpGoods = [];
|
||||
this.goods.forEach(_item=>{
|
||||
if(_item.goodsId != _goods.goodsId){
|
||||
_tmpGoods.push(_item);
|
||||
}
|
||||
})
|
||||
this.goods = _tmpGoods;
|
||||
this.$emit('deleteGoods',_goods);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
|
||||
</style>
|
||||
@ -663,6 +663,15 @@
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
}
|
||||
,{
|
||||
"path" : "pages/reserve/reserveOrder",
|
||||
"style" :
|
||||
{
|
||||
"navigationBarTitleText": "确认订单",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
|
||||
}
|
||||
],
|
||||
"tabBar": {
|
||||
"color": "#272636",
|
||||
|
||||
@ -30,11 +30,7 @@
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="block__title">支付方式</view>
|
||||
<view class="cu-form-group fee-last">
|
||||
<view class="title">微信支付</view>
|
||||
<switch @change="SwitchA" :class="switchA?'checked':''" :checked="switchA?true:false"></switch>
|
||||
</view> -->
|
||||
|
||||
</form>
|
||||
</scroll-view>
|
||||
<view class=" bg-white border flex cu-form-group" style="position: fixed;width: 100%;bottom: 0;">
|
||||
|
||||
@ -32,7 +32,8 @@
|
||||
<view class="text-red text-sm">￥{{item.price}}</view>
|
||||
</view>
|
||||
<view class="action">
|
||||
<view class="text-red text-sm">x 5</view>
|
||||
<!-- x 5 -->
|
||||
<view class="text-red text-sm"></view>
|
||||
<view>
|
||||
<button class="cu-btn round line-red sm" @click="_reserveDining(item)">预约</button>
|
||||
</view>
|
||||
@ -45,26 +46,29 @@
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class=" bg-white border flex justify-between" style="position: fixed;width: 100%;bottom: 0;">
|
||||
<view class="action text-red line-height margin-left">
|
||||
{{selectGoods.length}} 件商品
|
||||
<view class="action text-red line-height margin-left" @click="_showSelectdGoods">
|
||||
预约 {{selectGoods.length}} 件商品
|
||||
</view>
|
||||
<view class="flex justify-end">
|
||||
<view class="action text-orange margin-right line-height">
|
||||
合计：{{receivableAmount}}元
|
||||
</view>
|
||||
<view class="btn-group">
|
||||
<button class="cu-btn bg-red shadow-blur lgplus sharp" :disabled="receivableAmount == 0" @click="onPayFee()">支付</button>
|
||||
<button class="cu-btn bg-red shadow-blur lgplus sharp" :disabled="receivableAmount == 0" @click="_toReserveOrder()">支付</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<reserve-goods ref="reserveGoodsRef"></reserve-goods>
|
||||
<reserve-goods ref="reserveGoodsRef" @selectGoods="_selectGoods"></reserve-goods>
|
||||
<selectd-goods ref="selectdGoodsRef" @deleteGoods="_deleteGoods"></selectd-goods>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getCatalogs,getCatalogGoodss} from '@/api/community/reserveApi.js';
|
||||
import {getCommunityId} from '@/api/community/communityApi.js';
|
||||
import reserveGoods from '@/components/reserve/reserve-goods.vue'
|
||||
import reserveGoods from '@/components/reserve/reserve-goods.vue';
|
||||
|
||||
import selectdGoods from '@/components/reserve/selected-goods.vue'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
@ -88,6 +92,7 @@
|
||||
},
|
||||
components:{
|
||||
reserveGoods,
|
||||
selectdGoods
|
||||
},
|
||||
onLoad() {
|
||||
this.loadCatalog();
|
||||
@ -126,6 +131,46 @@
|
||||
_reserveDining:function(_dining){
|
||||
console.log(this.$refs.reserveGoodsRef)
|
||||
this.$refs.reserveGoodsRef.reserveGoods(_dining);
|
||||
},
|
||||
_selectGoods:function(_goods){
|
||||
this.selectGoods.push(_goods);
|
||||
this.computeGoodsPrice();
|
||||
},
|
||||
computeGoodsPrice:function(){
|
||||
this.receivableAmount = 0;
|
||||
if(this.selectGoods.length < 1){
|
||||
return;
|
||||
}
|
||||
this.selectGoods.forEach(_goods =>{
|
||||
let _quantity = _goods.hours.length * parseFloat(_goods.quantity);
|
||||
this.receivableAmount = (this.receivableAmount+ _quantity * parseFloat(_goods.price))//.toFixed(2);
|
||||
})
|
||||
},
|
||||
_showSelectdGoods:function(){
|
||||
this.$refs.selectdGoodsRef.viewSelectModal(this.selectGoods);
|
||||
},
|
||||
_deleteGoods:function(_goods){
|
||||
let _tmpGoods = [];
|
||||
this.selectGoods.forEach(_item=>{
|
||||
if(_item.goodsId != _goods.goodsId){
|
||||
_tmpGoods.push(_item);
|
||||
}
|
||||
})
|
||||
this.selectGoods = _tmpGoods;
|
||||
this.computeGoodsPrice();
|
||||
},
|
||||
_toReserveOrder:function(){
|
||||
if(!this.selectGoods || this.selectGoods.length< 1){
|
||||
uni.showToast({
|
||||
icon:'none',
|
||||
title:'未预约商品'
|
||||
});
|
||||
return ;
|
||||
}
|
||||
uni.setStorageSync('/pages/reserve/reserveOrder',this.selectGoods);
|
||||
uni.navigateTo({
|
||||
url:'/pages/reserve/reserveOrder'
|
||||
})
|
||||
}
|
||||
},
|
||||
}
|
||||
|
||||
195
pages/reserve/reserveOrder.vue
Normal file
195
pages/reserve/reserveOrder.vue
Normal file
@ -0,0 +1,195 @@
|
||||
<template>
|
||||
<view>
|
||||
<scroll-view scroll-y>
|
||||
<view class="block__title">订单信息</view>
|
||||
<form>
|
||||
<view class="cu-list menu">
|
||||
<view class="cu-form-group">
|
||||
<view class="title">预约人</view>
|
||||
<input v-model="personName" placeholder="请输入预约人" class="text-right"></input>
|
||||
</view>
|
||||
<view class="cu-form-group">
|
||||
<view class="title">预约电话</view>
|
||||
<input v-model="personTel" placeholder="请输入预约电话" class="text-right"></input>
|
||||
</view>
|
||||
<view class="cu-form-group arrow">
|
||||
<view class="title">预约日期</view>
|
||||
<picker mode="date" :value="appointmentTime" :start="todayDate" end="2050-09-01" @change="dateChange">
|
||||
<view class="picker">
|
||||
{{appointmentTime}}
|
||||
</view>
|
||||
</picker>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="block__title">预约商品</view>
|
||||
<view class="cu-list menu" v-for="(items,index) in selectdGoods" :key="index">
|
||||
<view class="cu-item">
|
||||
<view class="">
|
||||
<view class="text-grey">
|
||||
<text class="text-abc">{{items.goodsName}}({{items.quantity}}次) </text></view>
|
||||
<view class="text-gray text-sm flex justify-start">
|
||||
<view v-for="(item,index) in items.hours" :key="index">
|
||||
<view>{{item}}时;</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="action">
|
||||
<text class="text-red">￥{{items.money}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</form>
|
||||
</scroll-view>
|
||||
<view class=" bg-white border flex cu-form-group" style="position: fixed;width: 100%;bottom: 0;">
|
||||
|
||||
<view class="title">总计:
|
||||
<text class="solid-bottom text-xxl text-price text-red">{{totalMoney}}</text>
|
||||
</view>
|
||||
<view class="btn-group">
|
||||
<button @click="onPayFee()" class="cu-btn round bg-blue"
|
||||
style="background-color: #1cbbb4;">支付</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// pages/fee/payParkingFee.js
|
||||
import context from '../../lib/java110/Java110Context.js';
|
||||
const constant = context.constant;
|
||||
import url from '@/constant/url.js'
|
||||
|
||||
// #ifdef H5
|
||||
|
||||
const WexinPayFactory = require('../../factory/WexinPayFactory.js');
|
||||
|
||||
// #endif
|
||||
|
||||
// #ifdef APP-PLUS
|
||||
import {
|
||||
getPayInfo
|
||||
} from '../../factory/WexinAppPayFactory.js'
|
||||
// #endif
|
||||
|
||||
import {
|
||||
addMonth,
|
||||
formatDate,
|
||||
date2String,
|
||||
dateSubOneDay
|
||||
} from '../../lib/java110/utils/DateUtil.js';
|
||||
|
||||
import {getCurOwner} from '@/api/owner/ownerApi.js'
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
selectdGoods: [], // 订场信息
|
||||
appointmentTime: '请选择', // 订场列表
|
||||
totalMoney: 0, //
|
||||
personName: "",
|
||||
personTel: '', //
|
||||
communityId: "", // 注册者电话
|
||||
type: "1001", // 注册者名称
|
||||
todayDate:''
|
||||
};
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function(options) {
|
||||
context.onLoad(options);
|
||||
// #ifdef MP-WEIXIN
|
||||
let accountInfo = uni.getAccountInfoSync();
|
||||
this.appId = accountInfo.miniProgram.appId;
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
this.appId = uni.getStorageSync(constant.mapping.W_APP_ID)
|
||||
// #endif
|
||||
let _selectdGoods = uni.getStorageSync('/pages/reserve/reserveOrder');
|
||||
this.selectdGoods = _selectdGoods;
|
||||
let _that = this;
|
||||
getCurOwner()
|
||||
.then(_ownerInfo=>{
|
||||
_that.personName = _ownerInfo.appUserName;
|
||||
_that.personTel = _ownerInfo.link;
|
||||
_that.communityId = _ownerInfo.communityId;
|
||||
});
|
||||
this.todayDate = formatDate(new Date());
|
||||
this.totalMoney = 0;
|
||||
if(this.selectdGoods.length < 1){
|
||||
return;
|
||||
}
|
||||
this.selectdGoods.forEach(_goods =>{
|
||||
this.totalMoney = (this.totalMoney+ parseFloat(_goods.money))//.toFixed(2);
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
dateChange: function(e) {
|
||||
this.appointmentTime = e.detail.value;
|
||||
},
|
||||
onPayFee: function() {
|
||||
// debugger
|
||||
let _that = this;
|
||||
let _receivedAmount = this.receivableAmount;
|
||||
let _tradeType = 'JSAPI';
|
||||
payFeeWechat(this,{
|
||||
business: "reserveGoods",
|
||||
appointmentTime: this.appointmentTime,
|
||||
communityId: this.communityId,
|
||||
personName: this.personName,
|
||||
personTel: this.personTel,
|
||||
receivedAmount: _receivedAmount,
|
||||
tradeType: _tradeType,
|
||||
payWay:'2',//微信支付
|
||||
appId: this.appId,
|
||||
type: this.type,
|
||||
goodss: this.selectdGoods
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
.ppf_item{
|
||||
padding: 0rpx 0rpx 0rpx 0rpx;
|
||||
}
|
||||
|
||||
.block__title {
|
||||
margin: 0;
|
||||
font-weight: 400;
|
||||
font-size: 14px;
|
||||
color: rgba(69,90,100,.6);
|
||||
padding: 40rpx 30rpx 20rpx;
|
||||
}
|
||||
|
||||
.button_up_blank{
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.block__bottom{
|
||||
height: 180rpx;
|
||||
}
|
||||
.fee-last {
|
||||
margin-bottom: 200upx;
|
||||
}
|
||||
|
||||
.cu-btn.lgplus {
|
||||
padding: 0 20px;
|
||||
font-size: 18px;
|
||||
height: 100upx;
|
||||
|
||||
}
|
||||
|
||||
.cu-btn.sharp {
|
||||
border-radius: 0upx;
|
||||
}
|
||||
|
||||
.line-height {
|
||||
line-height: 100upx;
|
||||
}
|
||||
</style>
|
||||
Loading…
Reference in New Issue
Block a user