xt / xcx-book · Commits

Go to a project

Commit 8ff77a4caaa544086c77d23166c167fc73a26415

Authored by vking
1 parent 4f7544a1
build: skipped

pay

Inline Side-by-side
Showing 8 changed files with 546 additions and 1 deletions
... ... @@ -89,7 +89,8 @@
"pages/book/smsbatch/list",
"pages/book/smsbatch/result",
"pages/book/roomtype/roomtype",
"pages/book/b_reserve"
"pages/book/b_reserve",
"pages/checkout/index"
]
}
],
... ... @@ -152,6 +153,10 @@
"haowu": {
"version": "3.2.0",
"provider": "wx56c8f077de74b07c"
},
"vktool": {
"version": "2.1.8",
"provider": "wxd3dc4206c76f14fc"
}
},
"navigateToMiniProgramAppIdList": [
... ...
// pack-book/pages/checkout/index.js
import util from '../../../utils/util';
import App from '../../../utils/api';
import RS from '../../../utils/reserveStatus';
Page({
/**
* 页面的初始数据
*/
data: {
qnConf:{
accessKey:'uva-aaonM8dukeR6phc9yuPBrOXk9brrNW_PxLD7',
secretKey:'oZMMVN6phk49lG0J1xwmi1Ju0ETT15EnAEWcU9Cs',
token:'',
bucket:'colorcun-attr',//存储空间
fileType:'image',//image|video|audio|file def:file
region:'华东',//存储区域
domain:'http://nosqn.colorcun.com/',//你绑定的域名,非必填项
},
upConf:{
prefixPath:'paylist/images/', //上传到七牛后有一个路径前缀，可为空
loading:'leaf',// none|leaf|circle|ring, def leaf 上传的loading效果; none为无，可自行在page wxml中添加
group:'def', //一个页面上多个组件的区分标识
security:false, // 开启非法检测，默认 false
//上传图片
count:5, //最多可以选择的图片张数
sizeType:['compressed'], //['original', 'compressed'] 所选的图片的尺寸,超大图片 compressed 会引起开卡顿
sourceType:['album', 'camera'], //['album', 'camera'] 选择图片的来源
},
files:[], //组件数据放入这里展示到页面上
hasAddFile:true,//出现上传加号
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
this.options=options
this.setData({
[`upConf.prefixPath`]:'paylist/'+options.rid+'/'
})
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
this.getDetail();
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
detail:null,
getDetail(){
App.Reserve.Detail({
openid: getApp().openid,
rid: this.options.rid
}).then(async res => {
this.detail=this.formatDatail(res.data)
this.detail.ddate_solt=Number(this.detail.ddate_solt);
this.setData({
detail: this.detail
})
})
},
formatDatail(detail) {
detail=RS.reserve(detail);
let formatDate='YYYY-MM-DD '+detail.soltName
if(detail.type==1 && detail.is_set_ddate==1){
formatDate +=' HH:II'
}
detail.rdateStr = util.unixtoTime(detail.ddate, formatDate);
detail.orderRemark='';
if(detail.order_info){
if(detail.order_info.is_wine==1 || detail.order_info.is_pack==1){
detail.orderRemark='*顾客'
let orderRemark=[]
if(detail.order_info.is_wine==1){
orderRemark.push('有酒水要退')
}
if(detail.order_info.is_pack==1){
orderRemark.push('菜品需要打包')
}
detail.orderRemark+=orderRemark.join('，')
}
}
return detail;
},
displayTables(){
if(this.data.tabs){
this.setData({
tabs:'',
})
return;
}
let tables=this.detail.tables
let tabs={}
tables.some(t=>{
if(!tabs[t.tid]){
tabs[t.tid]=t.name
}else{
tabs[t.tid]+="、"+t.name
}
})
this.setData({
tabs:tabs,
})
},
setPrice(e){
this.price=e.detail.value.replace(/[^\.\d]/g,'')
this.setData({
price:this.price
})
return this.price
},
qnevent(e){
console.log('qnevent',e.detail);
this.setData({
files:e.detail.data,
hasAddFile:e.detail.data.length<this.data.upConf.count
})
},
displayImage(e){
let path=util.attr(e,'path')
wx.previewImage({
urls:[path],
})
},
deleteImage(e){
let index=util.attr(e,'index')
let files=this.data.files
files.splice(index,1)
this.setData({
files:files,
})
util.toast('图片已删除','none')
},
})
\ No newline at end of file
... ...
{
"backgroundTextStyle":"light",
"navigationBarBackgroundColor": "#fff",
"navigationBarTextStyle":"white",
"usingComponents": {
"nav":"/components/nav/nav",
"qnupload": "plugin://vktool/qnupload"
}
}
\ No newline at end of file
... ...
<!--pack-book/pages/checkout/index.wxml-->
<wxs src="../../../utils/util.wxs" module="util" />
<nav hasHome backgroundColor="#199095" color="#fefefe">{{title||'提前买单'}}</nav>
<view class="pages flex-vc">
<block wx:if="{{detail.order_info.status>1}}">
<view class="block payinfo">
<view class="title flex-lr">
<view>消费信息</view>
</view>
<view class="center">
<view class="item flex-lr">
<view class="item-label">应收金额</view>
<view class="item-value order_info-price">¥ {{detail.order_info.price}}</view>
</view>
<view class="item flex-lr" wx:if="{{detail.order_info.bill_list}}">
<view class="item-label">消费清单</view>
<view class="item-value order_info-bill_list">查看消费清单</view>
</view>
<view class="bg-img pay-tips-icon bg-pay{{detail.order_info.status}}"></view>
</view>
</view>
<view class="block userinfo">
<view class="title flex-lr">
<view>顾客信息</view>
<view class="orderRemark">{{detail.orderRemark}}</view>
</view>
<view class="center">
<view class="item flex-lr">
<view class="item-label">桌位信息</view>
<view class="item-value flex-rr">
【{{util.reserveTidName(detail.tables[0].tid)}}】{{detail.tables[0].name}}
<view class="bg-img bg-x1" wx:if="{{detail.tables.length>1}}"></view>
</view>
</view>
<view class="item flex-lr">
<view class="item-label">买单顾客</view>
<view class="item-value">{{detail.rname}} {{util.reserveSexName(detail.sex)}}</view>
</view>
<view class="item flex-lr">
<view class="item-label">顾客电话</view>
<view class="item-value">{{detail.phone}}</view>
</view>
<view class="item flex-lr">
<view class="item-label">到店时间</view>
<view class="item-value">{{detail.rdateStr}}</view>
</view>
<view class="item flex-lr">
<view class="item-label">申请时间</view>
<view class="item-value">{{util.unixtoTime(detail.order_info.create_time,'YYYY-MM-DD HH:II')}}</view>
</view>
</view>
</view>
</block>
<block wx:if="{{detail.order_info.status==1}}">
<view class="pay-image-view flex-vc">
<view class="bg-img bg-pay"></view>
<view class="pay-txt">顾客申请买单</view>
</view>
<view class="block orderinput">
<view class="center">
<view class="item {{tabs?'auto-height':''}}">
<view class="flex-lr" bindtap="{{detail.tables.length>1?'displayTables':''}}">
<view class="item-label">桌位信息</view>
<view class="item-value flex-rr">
<view wx:if="{{!tabs}}">【{{util.reserveTidName(detail.tables[0].tid)}}】{{detail.tables[0].name}}</view>
<view class="bg-img bg-{{tabs?'x2':'x1'}}" wx:if="{{detail.tables.length>1}}"></view>
</view>
</view>
<view class="tabs-view" wx:if="{{tabs}}">
<view class="tabs-item" wx:for="{{tabs}}" wx:key="tabs">【{{util.reserveTidName(index)}}】{{item}}</view>
</view>
</view>
<view class="item flex-lr">
<view class="item-label">应收金额</view>
<view class="item-value flex-rr" style="position: relative">
<input class="item-value-input"
bindinput="setPrice" type="digit" maxlength="8"
placeholder-style="font-size:32rpx" placeholder="点击填写金额"/>
<view wx:if="{{price}}"
style="right:{{price.length*25}}rpx;"
class="item-value-input hasPrice">￥</view>
</view>
</view>
</view>
</view>
<view class="orderRemark orderRemark-view" wx:if="{{detail.orderRemark}}">{{detail.orderRemark}}</view>
<view class="block orderimage">
<view class="title flex-lr">
<view>消费清单（选填）</view>
</view>
<view class="center">
<block wx:for="{{files}}" wx:key="files.key">
<qnupload qnConf="{{qnConf}}" upConf="{{upConf}}"
file="{{item}}" files="{{files}}"
bindevent="qnevent" class="qnupload">
<view class="upload flex-vc uploaded"
catchtap="displayImage" data-path="{{item.path}}"
style="background-image: url('{{item.path}}')">
<view class="bg-add bg-img" style="background-image: none"></view>
<view class="upload-txt"></view>
<view class="image-delete flex-vc" catchtap="deleteImage" data-index="{{index}}">
<view class="bg-img bg-c2"></view>
</view>
</view>
</qnupload>
</block>
<qnupload wx:if="{{hasAddFile}}"
qnConf="{{qnConf}}" upConf="{{upConf}}"
file="{{item}}" files="{{files}}"
bindevent="qnevent" class="qnupload">
<view class="upload flex-vc">
<view class="bg-add bg-img"></view>
<view class="upload-txt">添加图片</view>
</view>
</qnupload>
</view>
</view>
<view class="block userinfo">
<view class="title flex-lr">
<view>顾客信息</view>
</view>
<view class="center">
<view class="item flex-lr">
<view class="item-label">买单顾客</view>
<view class="item-value">{{detail.rname}} {{util.reserveSexName(detail.sex)}}</view>
</view>
<view class="item flex-lr">
<view class="item-label">顾客电话</view>
<view class="item-value">{{detail.phone}}</view>
</view>
<view class="item flex-lr">
<view class="item-label">到店时间</view>
<view class="item-value">{{detail.rdateStr}}</view>
</view>
<view class="item flex-lr">
<view class="item-label">申请时间</view>
<view class="item-value">{{util.unixtoTime(detail.order_info.create_time,'YYYY-MM-DD HH:II')}}</view>
</view>
</view>
</view>
</block>
</view>
... ...
/* pack-book/pages/checkout/index.wxss */
page{
background:rgba(245,245,245,1);
}
.bg-img{
background-image: url("http://nosqn.colorcun.com/checkout/images/css_sprites.png");
zoom: 33.5%;
}
.bg-add {
width: 48px; height: 48px;
background: url('http://nosqn.colorcun.com/checkout/images/css_sprites.png') -141px -111px;
}
.bg-c1 {
width: 36px; height: 36px;
background: url('http://nosqn.colorcun.com/checkout/images/css_sprites.png') -209px -111px;
}
.bg-x2 {
width: 42px; height: 24px;
background: url('http://nosqn.colorcun.com/checkout/images/css_sprites.png') -265px -111px;
}
.bg-x1 {
width: 42px; height: 24px;
background: url('http://nosqn.colorcun.com/checkout/images/css_sprites.png') -141px -179px;
margin-left: 20rpx;
}
.bg-pay3 {
width: 165px; height: 81px;
background: url('http://nosqn.colorcun.com/checkout/images/css_sprites.png') -10px -10px;
}
.bg-pay1 {
width: 165px; height: 81px;
background: url('http://nosqn.colorcun.com/checkout/images/css_sprites.png') -195px -10px;
}
.bg-pay {
width: 111px; height: 99px;
background: url('http://nosqn.colorcun.com/checkout/images/css_sprites.png') -10px -111px;
}
.bg-c2 {
width: 30px; height: 30px;
background: url('http://nosqn.colorcun.com/checkout/images/css_sprites.png') -10px -230px;
}
.pay-image-view{
margin-top: 40rpx;
}
.pay-txt{
margin-top: 12rpx;
height:44rpx;
font-size:32rpx;
font-weight:500;
color:rgba(53,53,53,1);
line-height:44rpx;
}
.block{
background:rgba(250,250,250,1);
border-radius:10rpx;
width: calc(100% - 40rpx);
margin-top: 20rpx;
}
.block .title{
height: 116rpx;
line-height: 116rpx;
font-size:32rpx;
font-weight:500;
color:rgba(53,53,53,1);
padding: 0 20rpx;
box-sizing: border-box;
}
.orderRemark{
font-size:28rpx;
font-weight:500;
color:rgba(253,86,86,1);
}
.orderRemark-view{
width: calc(100% - 40rpx);
height:40rpx;
line-height:40rpx;
margin: 10rpx auto;
font-weight:500;
}
.block .center{
padding: 0 40rpx 36rpx;
background:rgba(255,255,255,1);
box-sizing: border-box;
position: relative;
}
.center .item{
padding-top: 24rpx;
height:40rpx;
font-size:28rpx;
font-weight:400;
color:rgba(112,112,112,1);
line-height:40rpx;
}
.item-value{
font-weight:500;
color:rgba(53,53,53,1);
}
.pay-tips-icon{
position: absolute;
top:calc(50% - 84rpx);
left:calc(50% - 111rpx);
}
.order_info-price{
font-size:32rpx;
font-weight:500;
color:rgba(53,53,53,1);
}
.order_info-bill_list{
font-size:24rpx;
font-weight:500;
color:rgba(36,164,168,1);
height:34rpx;
line-height: 34rpx;
border-bottom: 2rpx solid #24A4A8;
}
.orderinput{
margin-top: 40rpx;
}
.orderinput .center{
padding-bottom: 0;
}
.orderinput .item{
font-size:32rpx;
font-weight:400;
height: 116rpx;
line-height: 116rpx;
box-sizing: border-box;
border-bottom: 2rpx solid rgba(238,238,238,1);
padding-top: 0;
}
.orderinput .auto-height{
height: auto;
}
.orderinput .item:last-child{
border-bottom-width: 0;
}
.item-value-input{
text-align: right;
font-size:44rpx;
font-weight:500;
color:rgba(53,53,53,1);
}
.tabs-view{
font-size:32rpx;
font-weight:400;
color:rgba(53,53,53,1);
padding: 0 20rpx 36rpx;
}
.tabs-item{
line-height: 44rpx;
}
.hasPrice{
position: absolute;
top:0;
right:30rpx;
height: 44rpx;
line-height: 44rpx;
}
.orderimage .center{
padding: 40rpx 0 36rpx 56rpx;
}
@import "upload.wxss";
\ No newline at end of file
... ...
.qnupload{
display: inline-block;
width: 180rpx;
height: 180rpx;
margin-right: 30rpx;
}
.upload{
border: 2px #E0E0E0 dashed ;
box-sizing: border-box;
position: relative;
width: 100%;
height: 100%;
background-size: cover;
background-repeat: no-repeat;
background-position: 50% 50%;
}
.uploaded{
border-width: 0;
}
.upload-txt{
height:34rpx;
font-size:24rpx;
font-family:PingFangSC-Medium,PingFang SC;
font-weight:500;
color:rgba(153,153,153,1);
line-height:34rpx;
margin-top: 10rpx;
}
.image-delete{
right: 0;
top:0;
position: absolute;
width:40rpx;
height:40rpx;
background:rgba(13,13,13,0.5);
}
\ No newline at end of file
... ...
... ... @@ -646,6 +646,13 @@
"pathName": "pack-checkout/pages/index",
"query": "rid=61685&sid=80",
"scene": null
},
{
"id": 81,
"name": "pack-book/pages/checkout/index",
"pathName": "pack-book/pages/checkout/index",
"query": "rid=62202",
"scene": null
}
]
}
... ...
... ... @@ -61,6 +61,14 @@ module.exports = {
enspace={morning: 1, noon: 2, night: 3}[enspace]
return names[enspace]||names[4]
},
reserveTidName:function(enspace){
var names=['','散座','包间','卡座'];
return names[(enspace*1)]||''
},
reserveSexName:function(enspace){
var names=['','先生','女士',''];
return names[(enspace*1)]||''
},
getRoomName:function(rooms=[]){
if(rooms.length<1) return ""
var name=rooms[0].name
... ...