myTest383
5 months ago
43 changed files with 2393 additions and 1853 deletions
@ -1,46 +1,46 @@ |
|||||
.tab-bar { |
.tab-bar { |
||||
pointer-events: auto; |
pointer-events: auto; |
||||
position: absolute; |
position: absolute; |
||||
bottom: 0; |
bottom: 0; |
||||
left: 0; |
left: 0; |
||||
right: 0; |
right: 0; |
||||
height: 50px; |
height: 50px; |
||||
/* background: #F69448; */ |
/* background: #F69448; */ |
||||
display: flex; |
display: flex; |
||||
padding-top: 5px; |
padding-top: 5px; |
||||
padding-bottom: 5px; |
padding-bottom: 5px; |
||||
/* 加载背景图 */ |
/* 加载背景图 */ |
||||
background-image: url(https://supervise.yxtsoft.com/lpk/image/bom_navigation.png); |
background-image: url(https://supervise.yxtsoft.com/lpk/image/bom_navigation_new.png); |
||||
/* 让背景图基于容器大小伸缩 */ |
/* 让背景图基于容器大小伸缩 */ |
||||
background-size: 100% 100%; |
background-size: 100% 100%; |
||||
/* padding-bottom: env(safe-area-inset-bottom); */ |
/* padding-bottom: env(safe-area-inset-bottom); */ |
||||
} |
} |
||||
|
|
||||
.tab-bar-border { |
.tab-bar-border { |
||||
background-color: rgba(246, 148, 72, 0.3); |
background-color: rgba(246, 148, 72, 0.3); |
||||
position: absolute; |
position: absolute; |
||||
left: 0; |
left: 0; |
||||
top: 0; |
top: 0; |
||||
width: 100%; |
width: 100%; |
||||
height: 1px; |
height: 1px; |
||||
transform: scaleY(0.5); |
transform: scaleY(0.5); |
||||
} |
} |
||||
|
|
||||
.tab-bar-item { |
.tab-bar-item { |
||||
flex: 1; |
flex: 1; |
||||
text-align: center; |
text-align: center; |
||||
display: flex; |
display: flex; |
||||
justify-content: center; |
justify-content: center; |
||||
align-items: center; |
align-items: center; |
||||
flex-direction: column; |
flex-direction: column; |
||||
} |
} |
||||
|
|
||||
.tab-bar-item cover-image { |
.tab-bar-item cover-image { |
||||
width: 27px; |
width: 27px; |
||||
height: 27px; |
height: 27px; |
||||
} |
} |
||||
|
|
||||
.tab-bar-item cover-view { |
.tab-bar-item cover-view { |
||||
margin-top: 3px; |
margin-top: 3px; |
||||
font-size: 10px; |
font-size: 10px; |
||||
} |
} |
||||
@ -0,0 +1,424 @@ |
|||||
|
<template> |
||||
|
<view style="width: 100%;height: 100%;background: #60CA2C;display: flex;flex-direction: column;"> |
||||
|
|
||||
|
<NavBar ref="nav" navTitle="预约提货" :showIcon="true" :supportChange="false"> |
||||
|
</NavBar> |
||||
|
|
||||
|
<loading-state ref="pageView" @request="request"> |
||||
|
|
||||
|
<!-- <view style="background: #FFA35A;width: 100%;height: 100%;"> --> |
||||
|
|
||||
|
|
||||
|
<view style="display: flex;flex-direction: column;background: #F2F2F2; width: 100%; |
||||
|
border-radius: 25px;height: 100vh; padding: 10px;box-sizing: border-box;"> |
||||
|
|
||||
|
<view style="display: flex;flex-direction: column;background: #fff; |
||||
|
border-radius: 15px;padding: 15px 10px;"> |
||||
|
|
||||
|
<view v-if="info.storeSid!=''" |
||||
|
style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;"> |
||||
|
|
||||
|
<text |
||||
|
style="font-size: 16px;color: #000; font-weight: 600;font-family: sans-serif;">{{info.storeName}}</text> |
||||
|
|
||||
|
<view style="display: flex;flex-direction: row;align-items: center;" @click="address()"> |
||||
|
<text style="font-size: 12px;color: #FF9900;">切换</text> |
||||
|
<image src="../../static/right_icon.png" style="width: 15px;height: 15px;margin-left: 5px;"> |
||||
|
</image> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
<view v-if="info.storeSid==''" |
||||
|
style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;"> |
||||
|
|
||||
|
<text |
||||
|
style="font-size: 16px;color: #000; font-weight: 600;font-family: sans-serif;">暂无提货点信息</text> |
||||
|
|
||||
|
<view style="display: flex;flex-direction: row;align-items: center;" @click="address()"> |
||||
|
<text style="font-size: 12px;color: #FF9900;">去完善</text> |
||||
|
<image src="../../static/right_icon.png" style="width: 15px;height: 15px;margin-left: 5px;"> |
||||
|
</image> |
||||
|
</view> |
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
<view v-if="info.storeSid!=''" |
||||
|
style="display: flex;flex-direction: row;align-items: center;margin-top: 15px;"> |
||||
|
<image src="https://supervise.yxtsoft.com/lpk/image/date.png" style="width:20px;height: 20px;"> |
||||
|
</image> |
||||
|
<text |
||||
|
style="margin-left: 5px;flex: 1;color: #666;font-size: 14px;">{{info.businessHours}}</text> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
<view v-if="info.storeSid!=''" |
||||
|
style="display: flex;flex-direction: row;align-items: center;margin-top: 15px;"> |
||||
|
<image src="https://supervise.yxtsoft.com/lpk/image/location.png" |
||||
|
style="width: 20px;height: 20px;"> |
||||
|
</image> |
||||
|
<text style="margin-left: 5px;flex: 1; color: #666;font-size: 14px;">{{info.address}}</text> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
<!-- <view style="display: flex;flex-direction: row;align-items: center;"> |
||||
|
|
||||
|
<text |
||||
|
style="font-size: 14px;color: #000; font-weight: 600;font-family: sans-serif; ">配送地址</text> |
||||
|
|
||||
|
<textarea bindblur="bindTextAreaBlur" :value="info.userAddress" @input="onKeyInput2" |
||||
|
style=" margin-left: 15px;border-bottom: 1px solid #ccc; padding-bottom: 5px; flex: 1;" |
||||
|
auto-height placeholder="请输入详细配送地址精确到门牌号" /> |
||||
|
</view> |
||||
|
--> |
||||
|
|
||||
|
<view |
||||
|
style="display: flex;flex-direction: row;align-items: center;justify-content: center;margin-top: 16px;"> |
||||
|
<text |
||||
|
style="font-size: 14px;color: #000; font-weight: 600;font-family: sans-serif; flex: 1;">提货时间</text> |
||||
|
|
||||
|
<uni-datetime-picker type="date" v-model="info.reserveDate" :start="info.start" |
||||
|
:clearIcon="false" :border="false" :disabledDate="disabledDate" /> |
||||
|
<image src="../../static/right_icon.png" style="width: 15px;height: 15px;margin-left: 5px;"> |
||||
|
</image> |
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
<view style="margin-top: 10px;display: flex;flex-direction: row;background: #fff;align-items: center; |
||||
|
border-radius: 15px;padding: 15px 10px;justify-content: space-between;"> |
||||
|
|
||||
|
<text style="font-size: 14px;color: #000; font-weight: 600;font-family: sans-serif;">联系人</text> |
||||
|
|
||||
|
<view v-if="info.name!=''" style="display: flex;flex-direction: row;align-items: center;" |
||||
|
@click="changePer()"> |
||||
|
|
||||
|
<text |
||||
|
style="font-size: 14px;color: #000; font-weight: 600;font-family: sans-serif;">{{info.name}}</text> |
||||
|
<text style="font-size: 12px;color: #999; margin-left: 8px;">{{info.phone}}</text> |
||||
|
|
||||
|
<image src="../../static/right_icon.png" style="width: 15px;height: 15px;margin-left: 5px;"> |
||||
|
</image> |
||||
|
</view> |
||||
|
|
||||
|
<view v-if="info.name==''" style="display: flex;flex-direction: row;align-items: center;" |
||||
|
@click="changePer()"> |
||||
|
|
||||
|
<text style="font-size: 12px;color: #999; margin-left: 8px;">去完善</text> |
||||
|
|
||||
|
<image src="../../static/right_icon.png" style="width: 15px;height: 15px;margin-left: 5px;"> |
||||
|
</image> |
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
<view |
||||
|
style="margin-top: 10px;display: flex;flex-direction: column;background: #fff;border-radius: 15px;padding: 10px;"> |
||||
|
|
||||
|
<text style="font-size: 15px; color: #000; font-weight: 600;font-family: sans-serif;">提货列表</text> |
||||
|
|
||||
|
<scroll-view scroll-y="true" style="max-height:calc(100vh - 400px); width: 100%; box-sizing: border-box; margin-top: 10px;; |
||||
|
" bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll"> |
||||
|
|
||||
|
<view style="width: 100%; display: flex;flex-direction: column; margin-top: 10px;"> |
||||
|
<view v-for="(item,index) in pickingUpGoods" |
||||
|
style="display: flex;flex-direction: column;justify-content: center;width: 100%; margin-top: 15px; "> |
||||
|
|
||||
|
<view style="display: flex;flex-direction: row;align-items: center;width: 100%; "> |
||||
|
|
||||
|
<image :src="item.iconUrl" @click="itemClick(item.goodsSid)" |
||||
|
style="width: 90px;height: 90px; border-radius: 10px; " mode="aspectFill"> |
||||
|
</image> |
||||
|
|
||||
|
<view |
||||
|
style="display: flex;flex-direction: column;flex: 1; padding-bottom: 15px; margin-left: 10px;" |
||||
|
:style="{'border-bottom':(index == pickingUpGoods.length-1 ? 'none' : '1px #EFEFEF solid')}"> |
||||
|
|
||||
|
<text style="font-size: 13px;color: #000;" |
||||
|
@click="itemClick(item.goodsSid)">{{item.name}}</text> |
||||
|
|
||||
|
<!-- <text |
||||
|
style="font-size: 10px;color: #999;margin-top: 5px;">{{item.remark}}</text> --> |
||||
|
|
||||
|
<view |
||||
|
style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
||||
|
<text style="border: 1px #EE752F solid; border-radius: 5px; padding: 0px 8px; |
||||
|
font-size: 10px;color: #EE752F; ">{{item.weight}}{{item.specificationUnit}}/{{item.unitName}}</text> |
||||
|
|
||||
|
<text v-show="item.remarks!=''" style="margin-left: 10px; border: 1px #EE752F solid; border-radius: 5px; padding: 0px 8px; |
||||
|
font-size: 10px;color: #EE752F;">{{item.remarks}}</text> |
||||
|
<text |
||||
|
style="border: 1px #EE752F solid; background: #FF9900; color: #fff; font-size: 10px;border-radius: 5px; padding: 0px 8px;" |
||||
|
v-if="item.type=='0'">百姓菜!</text> |
||||
|
<text |
||||
|
style="border: 1px #3AA15F solid; background: #40C772; color: #fff; font-size: 10px;border-radius: 5px; padding: 0px 8px;" |
||||
|
v-if="item.type=='1'">精品菜!</text> |
||||
|
<text |
||||
|
style="border: 1px #1D60C7 solid; background: #2489F7; color: #fff; font-size: 10px;border-radius: 5px; padding: 0px 8px;" |
||||
|
v-if="item.type=='2'">企业菜!</text> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
<view style="display: flex;flex-direction: row;align-items: center;justify-content: space-between; margin-top: 15px; |
||||
|
margin-right: 15px;"> |
||||
|
|
||||
|
|
||||
|
<view style="display: flex;flex-direction: row;align-items: center;"> |
||||
|
<text style="font-size: 12px;color: #FF5006;">存量：</text> |
||||
|
<text |
||||
|
style="font-size: 14px;color: #FF5006;">{{item.goodsNumber}}</text> |
||||
|
</view> |
||||
|
|
||||
|
|
||||
|
|
||||
|
<view style="display: flex;flex-direction: row;align-items: center;"> |
||||
|
|
||||
|
<image src="../../static/jian_icon.png" mode="aspectFill" |
||||
|
style="width: 20px;height: 20px;" @click.stop="jian(item)"> |
||||
|
</image> |
||||
|
|
||||
|
<text |
||||
|
style="font-size: 14px;margin-left: 8px;margin-right: 8px;">{{item.count}}</text> |
||||
|
<image src="../../static/jia_icon.png" mode="aspectFill" |
||||
|
style="width: 20px;height: 20px;" @click.stop="jia(item)"> |
||||
|
</image> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
</scroll-view> |
||||
|
|
||||
|
</view> |
||||
|
|
||||
|
<view |
||||
|
style=" position: fixed;bottom: 0; width: 100%; box-sizing: border-box; padding-left: 10vw;padding-right: 10vw;display: flex;flex-direction: row; justify-content: center;align-items: center;"> |
||||
|
<text style=" background: #60CA2C;color: #fff;margin-bottom: 20px; border-radius: 20px; |
||||
|
padding-top: 10px;padding-bottom: 10px;padding-left: 25vw;padding-right: 25vw; text-align: center;" |
||||
|
@click="congirmExtract()">确认提货</text> |
||||
|
</view> |
||||
|
|
||||
|
</view> |
||||
|
<!-- </view> --> |
||||
|
</loading-state> |
||||
|
</view> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
affiliation: "", |
||||
|
delivery: "", |
||||
|
info: { |
||||
|
|
||||
|
}, |
||||
|
pickingUpGoods: [], |
||||
|
disabledDate: [ |
||||
|
// '2023-12-16' |
||||
|
], |
||||
|
btnDisabled: false |
||||
|
} |
||||
|
}, |
||||
|
onLoad(options) { |
||||
|
|
||||
|
uni.$on("address", (e) => { |
||||
|
// 相当与下拉刷新 |
||||
|
this.info.storeSid = e.sid; |
||||
|
this.info.storeName = e.name; |
||||
|
this.info.businessHours = e.businessHours; |
||||
|
this.info.address = e.address; |
||||
|
}) |
||||
|
|
||||
|
uni.$on("changePer", (e) => { |
||||
|
// 相当与下拉刷新 |
||||
|
this.info.name = e.name; |
||||
|
this.info.phone = e.phone; |
||||
|
}) |
||||
|
|
||||
|
|
||||
|
this.pickingUpGoods = JSON.parse(decodeURIComponent(options.pickingUpGoods)) |
||||
|
this.affiliation = options.affiliation |
||||
|
this.delivery = options.delivery |
||||
|
|
||||
|
console.log(">>>>>", options); |
||||
|
console.log(">>>>>", this.pickingUpGoods); |
||||
|
console.log(">>>>>", this.affiliation); |
||||
|
console.log(">>>>>", this.delivery); |
||||
|
|
||||
|
this.request() |
||||
|
this.getSun() |
||||
|
|
||||
|
}, |
||||
|
onUnload() { |
||||
|
uni.$off('address'); |
||||
|
uni.$off('changePer'); |
||||
|
}, |
||||
|
methods: { |
||||
|
onKeyInput2(val) { |
||||
|
this.info.userAddress = val.detail.value |
||||
|
}, |
||||
|
itemClick(goodsSid) { |
||||
|
uni.navigateTo({ |
||||
|
url: '/pages/good/goodsDetail?sid=' + goodsSid |
||||
|
}) |
||||
|
}, |
||||
|
getSun() { |
||||
|
let _this = this |
||||
|
_this.$api.getExtractSaturAndSun().then((resp) => { |
||||
|
|
||||
|
_this.disabledDate = resp |
||||
|
|
||||
|
}).catch(e => { |
||||
|
|
||||
|
}) |
||||
|
}, |
||||
|
address() { |
||||
|
uni.navigateTo({ |
||||
|
url: '/pages/SelectAddressActivity' |
||||
|
}) |
||||
|
}, |
||||
|
changePer() { |
||||
|
uni.navigateTo({ |
||||
|
url: '/pages/good/changePersonnel?name=' + this.info.name + "&phone=" + this.info.phone |
||||
|
}) |
||||
|
}, |
||||
|
// 获取数据 |
||||
|
request() { |
||||
|
let _this = this |
||||
|
var params = { |
||||
|
customerSid: getApp().globalData.sid, |
||||
|
delivery: _this.delivery |
||||
|
} |
||||
|
|
||||
|
console.log(">>>>>", params); |
||||
|
_this.$api.getStoreBySid(params).then((resp) => { |
||||
|
_this.info = resp |
||||
|
_this.$nextTick(() => { |
||||
|
_this.$refs.pageView.setLoadState(2) |
||||
|
}) |
||||
|
|
||||
|
}).catch(e => { |
||||
|
console.log(e); |
||||
|
}) |
||||
|
}, |
||||
|
|
||||
|
jian(item) { |
||||
|
console.log("item》》》》", item) |
||||
|
const that = this |
||||
|
if (Number(item.count) == 1) { |
||||
|
|
||||
|
wx.showModal({ |
||||
|
content: '确定不要了吗', |
||||
|
cancelText: "再想想", |
||||
|
confirmText: "删除", |
||||
|
confirmColor: "#FF9900", |
||||
|
success(res) { |
||||
|
if (res.confirm) { |
||||
|
console.log('用户点击确定') |
||||
|
item.count = 0 |
||||
|
const index = that.pickingUpGoods.findIndex((info) => info.goodsSid === item |
||||
|
.goodsSid) |
||||
|
console.log("index》》》》", index) |
||||
|
that.pickingUpGoods.splice(index, 1) |
||||
|
} else if (res.cancel) { |
||||
|
|
||||
|
} |
||||
|
} |
||||
|
}) |
||||
|
|
||||
|
} else { |
||||
|
if (Number(item.count) > 0) { |
||||
|
item.count = Number(item.count) - 1 |
||||
|
} |
||||
|
|
||||
|
} |
||||
|
}, |
||||
|
jia(item) { |
||||
|
if (item.count < item.goodsNumber) |
||||
|
item.count = Number(item.count) + 1 |
||||
|
}, |
||||
|
congirmExtract() { |
||||
|
let _this = this |
||||
|
|
||||
|
if (this.btnDisabled) { |
||||
|
this.shortToast('请勿重复点击') |
||||
|
return |
||||
|
} |
||||
|
|
||||
|
this.btnDisabled = true |
||||
|
|
||||
|
if (_this.info.storeSid == '') { |
||||
|
this.shortToast('请完善提货点信息') |
||||
|
return |
||||
|
} |
||||
|
|
||||
|
|
||||
|
if (_this.info.reserveDate == '') { |
||||
|
this.shortToast('请选择日期') |
||||
|
this.btnDisabled = false |
||||
|
return |
||||
|
} |
||||
|
|
||||
|
if (this.info.name == "" || this.info.phone == '') { |
||||
|
this.shortToast('请完善联系人信息') |
||||
|
this.btnDisabled = false |
||||
|
return |
||||
|
} |
||||
|
|
||||
|
let list = [] |
||||
|
|
||||
|
for (var i = 0; i < this.pickingUpGoods.length; i++) { |
||||
|
var item = this.pickingUpGoods[i] |
||||
|
if (item.count > 0) |
||||
|
list.push({ |
||||
|
goodsSid: item.goodsSid, |
||||
|
select: item.count, |
||||
|
}) |
||||
|
} |
||||
|
// console.log("ddd", list); |
||||
|
|
||||
|
if (list.length == 0) { |
||||
|
this.shortToast('请添加商品') |
||||
|
this.btnDisabled = false |
||||
|
return |
||||
|
} |
||||
|
|
||||
|
var params = { |
||||
|
customerSid: getApp().globalData.sid, |
||||
|
affiliation: _this.affiliation, |
||||
|
reserveDate: _this.info.reserveDate, |
||||
|
storeSid: _this.info.storeSid, |
||||
|
userAddress: '', |
||||
|
userName: _this.info.name, |
||||
|
userPhone: _this.info.phone, |
||||
|
goodsVos: list |
||||
|
} |
||||
|
console.log("pppp", params); |
||||
|
|
||||
|
_this.$api.submissionExtract2(params).then((resp) => { |
||||
|
uni.navigateBack() |
||||
|
_this.btnDisabled = false |
||||
|
}).catch(e => { |
||||
|
console.log(e); |
||||
|
_this.btnDisabled = false |
||||
|
}) |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
|
||||
|
<style> |
||||
|
|
||||
|
</style> |
||||
@ -1,252 +1,254 @@ |
|||||
<template> |
<template> |
||||
<view style="height: 100%;display: flex;flex-direction: column;align-items: center;"> |
<view style="height: 100%;display: flex;flex-direction: column;align-items: center;"> |
||||
<view |
<view |
||||
style="display: flex;flex-direction: column;align-items: center;overflow-y: scroll;flex:1;padding-top: 60rpx;"> |
style="display: flex;flex-direction: column;align-items: center;overflow-y: scroll;flex:1;padding-top: 60rpx;"> |
||||
<view style="color: #666;margin-left: 20rpx;margin-right: 20rpx;text-align: center;font-size: 24rpx;"> |
<view style="color: #666;margin-left: 20rpx;margin-right: 20rpx;text-align: center;font-size: 24rpx;"> |
||||
{{convertSecondsToHMS(page.countdown)}} |
{{convertSecondsToHMS(page.countdown)}} |
||||
</view> |
</view> |
||||
<view> |
<view> |
||||
<text style="color: black;font-size: 35rpx;font-weight: bold;">￥</text> |
<text style="color: black;font-size: 35rpx;font-weight: bold;">￥</text> |
||||
<text style="color: black;font-size: 70rpx;font-weight: bold;">{{data.price}}</text> |
<text style="color: black;font-size: 70rpx;font-weight: bold;">{{data.price}}</text> |
||||
</view> |
</view> |
||||
<view style="color: #666;margin-left: 20rpx;margin-right: 20rpx;text-align: center;font-size: 24rpx;"> |
<view style="color: #666;margin-left: 20rpx;margin-right: 20rpx;text-align: center;font-size: 24rpx;"> |
||||
{{data.goods}} |
{{data.goods}} |
||||
</view> |
</view> |
||||
|
|
||||
<view style="background: #ffffff;margin-top: 100rpx;border-radius: 20rpx;width: calc(100vw - 40rpx);"> |
<view style="background: #ffffff;margin-top: 100rpx;border-radius: 20rpx;width: calc(100vw - 40rpx);"> |
||||
<radio-group @change="radioChange"> |
<radio-group @change="radioChange"> |
||||
<label |
<label |
||||
style="width: 100%;height: 120rpx;display: flex;flex-direction: column;justify-content: center;align-items: center;" |
style="width: 100%;height: 120rpx;display: flex;flex-direction: column;justify-content: center;align-items: center;" |
||||
v-for="(item, index) in page.real" :key="index"> |
v-for="(item, index) in page.real" :key="index"> |
||||
<view style="width: 100%;height: 120rpx;display: flex;flex-direction: row;align-items: center;"> |
<view style="width: 100%;height: 120rpx;display: flex;flex-direction: row;align-items: center;"> |
||||
<image :src="item.image" style="width: 55rpx;height: 55rpx;margin-left: 25rpx;"></image> |
<image :src="item.image" style="width: 55rpx;height: 55rpx;margin-left: 25rpx;"></image> |
||||
<text style="flex: 1;font-size: 30rpx;margin-left: 6rpx;">{{item.pay}}</text> |
<text style="flex: 1;font-size: 30rpx;margin-left: 6rpx;">{{item.pay}}</text> |
||||
<radio style="transform:scale(0.8);margin-right: 25rpx;" :checked="index==0" |
<radio style="transform:scale(0.8);margin-right: 25rpx;" :checked="index==0" |
||||
:value="index+''" :activeBackgroundColor="item.btnColor" /> |
:value="index+''" :activeBackgroundColor="item.btnColor" /> |
||||
</view> |
</view> |
||||
<view v-if="index != page.real.length-1" |
<view v-if="index != page.real.length-1" |
||||
style="width: 93%;height: 1px;background-color: #f1f2f3;"></view> |
style="width: 93%;height: 1px;background-color: #f1f2f3;"></view> |
||||
</label> |
</label> |
||||
</radio-group> |
</radio-group> |
||||
</view> |
</view> |
||||
</view> |
</view> |
||||
<view class="btn" :style="{'background': page.real[page.selected].btnColor}" @click="createOrder"> |
<view class="btn" :style="{'background': page.real[page.selected].btnColor}" @click="createOrder"> |
||||
{{page.submitText}} |
{{page.submitText}} |
||||
</view> |
</view> |
||||
</view> |
</view> |
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
import { |
import { |
||||
http |
http |
||||
} from '../../utils/pay_http.js' |
} from '../../utils/pay_http.js' |
||||
export default { |
export default { |
||||
data() { |
data() { |
||||
return { |
return { |
||||
page: { |
page: { |
||||
// 本插件提供的支付方式 |
// 本插件提供的支付方式 |
||||
supports: [{ |
supports: [{ |
||||
payType: 'wxpay', |
payType: 'wxpay', |
||||
pay: '微信', |
pay: '微信', |
||||
image: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAADcUlEQVR4nO2ZfVLaUBDAdyFCAGekJyg9Qb2BMBX/lZ4APEHxBOIJSk+gnqD0X6EFT6A9QfUExZkCAUK2u1iYNF98+CiR8ptR92Xy8X4vm7cvEWFD2IqEjf9DJN3UMwMTihyunZgGV+2ccQ8++Iqk6vGPFkCZw9AQAah28v1TDl14iqQa8apF8IHD0BFB+NQ57LsG2CUi6dQ36QeHoSWu4RtnmrlEknW9QkBnHIaYyGkv36tyMOVFiiDgeTdvVMDGVmSdbEUWAx+QoIVR/rHgHmxwXcoCQQaQCgSwx5uWYsUieBMFqPzKGy2Yg2QjWSCyygB0wM2FWIkIn+AxAliYV8DJH6EqC73m5lwoF+EU+h7bSWTbuXabm0uTbqbTg2GvRQhvuTkTpSKqJCaITN80anxnDrgZiDIRPugxpiUyqiSEVEMvElGZAPa5GYg6EYy+7x52axw+C7kLw5FxbFlQ4VucAUYWhdaMBasSEUmp7lF/n8OlEYGBaXBnx3cgzZukI19iGpZlMZi81i8JqcibPVEiwmPmWrAJ0rlZqSYr68EIzoioBFPwgaftkn3We5rJRp859ESJiNcSetxBk24BoydeKbdb17MWQpFsAnzhR/5ddXZIkEHpm72fHHqCKkR6+b7rGCFZj9cI4DjCb3E7WuJc7o4IjADOOIWyYINPME0j8CFRjxP/8WSlIk+dpiaHY3inNvHgcmjDnUZ+rE1ESF7H77yKGh/gm0Z+rFwkriVeSdpw6CL1VS9ZFl1wOAUJr2I7UAlKIyfyzAW9bisRmVVD+FmRlNrjPW84jSrzpJETrwGxo0aER7h7ZJTABxnNIUTTnVznjptLwYNxSwEVXomIEJRez8U5aXihTAQRL7uHxgmHShnXj6HB9YgyEIAyEWHWs7IMyYZ+Qbai6YdaEa4TGMHTzjvjEhQwr4SgVGRCJIInz5FJNVP7ZJoXFPBwO1mJyKxZzA+Z3WQBCTT+EJHmTXOzGhHbSWXVyt9KjvmkrZ0o3DiL4O43/WBk4T6SlSUA3nc57NecwNf8m0VFooA5TdPvBmZP0mPpzi3CSkRkKiYLspxjGfhHrERkHWxFwsbGiHD1cn03cInI/B70LhAGvL4buESEjfhn6IQwyvhJCL4iwlOaYQGB0txcGwTYjmtUc6aTnUCRl8RWJGxsjMhvudpkUV3iI98AAAAASUVORK5CYII=', |
image: 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAADcUlEQVR4nO2ZfVLaUBDAdyFCAGekJyg9Qb2BMBX/lZ4APEHxBOIJSk+gnqD0X6EFT6A9QfUExZkCAUK2u1iYNF98+CiR8ptR92Xy8X4vm7cvEWFD2IqEjf9DJN3UMwMTihyunZgGV+2ccQ8++Iqk6vGPFkCZw9AQAah28v1TDl14iqQa8apF8IHD0BFB+NQ57LsG2CUi6dQ36QeHoSWu4RtnmrlEknW9QkBnHIaYyGkv36tyMOVFiiDgeTdvVMDGVmSdbEUWAx+QoIVR/rHgHmxwXcoCQQaQCgSwx5uWYsUieBMFqPzKGy2Yg2QjWSCyygB0wM2FWIkIn+AxAliYV8DJH6EqC73m5lwoF+EU+h7bSWTbuXabm0uTbqbTg2GvRQhvuTkTpSKqJCaITN80anxnDrgZiDIRPugxpiUyqiSEVEMvElGZAPa5GYg6EYy+7x52axw+C7kLw5FxbFlQ4VucAUYWhdaMBasSEUmp7lF/n8OlEYGBaXBnx3cgzZukI19iGpZlMZi81i8JqcibPVEiwmPmWrAJ0rlZqSYr68EIzoioBFPwgaftkn3We5rJRp859ESJiNcSetxBk24BoydeKbdb17MWQpFsAnzhR/5ddXZIkEHpm72fHHqCKkR6+b7rGCFZj9cI4DjCb3E7WuJc7o4IjADOOIWyYINPME0j8CFRjxP/8WSlIk+dpiaHY3inNvHgcmjDnUZ+rE1ESF7H77yKGh/gm0Z+rFwkriVeSdpw6CL1VS9ZFl1wOAUJr2I7UAlKIyfyzAW9bisRmVVD+FmRlNrjPW84jSrzpJETrwGxo0aER7h7ZJTABxnNIUTTnVznjptLwYNxSwEVXomIEJRez8U5aXihTAQRL7uHxgmHShnXj6HB9YgyEIAyEWHWs7IMyYZ+Qbai6YdaEa4TGMHTzjvjEhQwr4SgVGRCJIInz5FJNVP7ZJoXFPBwO1mJyKxZzA+Z3WQBCTT+EJHmTXOzGhHbSWXVyt9KjvmkrZ0o3DiL4O43/WBk4T6SlSUA3nc57NecwNf8m0VFooA5TdPvBmZP0mPpzi3CSkRkKiYLspxjGfhHrERkHWxFwsbGiHD1cn03cInI/B70LhAGvL4buESEjfhn6IQwyvhJCL4iwlOaYQGB0txcGwTYjmtUc6aTnUCRl8RWJGxsjMhvudpkUV3iI98AAAAASUVORK5CYII=', |
||||
btnColor: '#FE9039' |
btnColor: '#60CA2C' |
||||
}], |
}], |
||||
// 可使用的方式，主要是对App,h5可进行定义，微信小程序定时时无效(因为仅支持微信支付) |
// 可使用的方式，主要是对App,h5可进行定义，微信小程序定时时无效(因为仅支持微信支付) |
||||
use: [0], |
use: [0], |
||||
real: [], |
real: [], |
||||
selected: 0, |
selected: 0, |
||||
countdown: 0, |
countdown: 0, |
||||
submitText: '确认支付', |
submitText: '确认支付', |
||||
cancleText: '订单已取消' |
cancleText: '订单已取消' |
||||
}, |
}, |
||||
data: { |
data: { |
||||
price: '价格', |
price: '价格', |
||||
goods: '商品名称', |
goods: '商品名称', |
||||
remainder: 60000, |
remainder: 60000, |
||||
// 生成待支付订单时后台返回的,具体地址是啥，参数是啥由后台提供 |
// 生成待支付订单时后台返回的,具体地址是啥，参数是啥由后台提供 |
||||
// 唯一支付方式固定为type参数 |
// 唯一支付方式固定为type参数 |
||||
pay_url: { |
pay_url: { |
||||
url: '底梦哲提供，王鹏飞进行组装成绝对地址返回', |
url: '底梦哲提供，王鹏飞进行组装成绝对地址返回', |
||||
// 底梦哲提接口传参要求，王鹏飞进行组装 |
// 底梦哲提接口传参要求，王鹏飞进行组装 |
||||
params: { |
params: { |
||||
// 此参数由本工具进行返回，后台不需要传 |
// 此参数由本工具进行返回，后台不需要传 |
||||
type: '支付方式，由本框架提供', |
type: '支付方式，由本框架提供', |
||||
// ...更多参数 |
// ...更多参数 |
||||
} |
} |
||||
}, |
}, |
||||
// 由前端去设置，查看订单的详情地址 |
// 由前端去设置，查看订单的详情地址 |
||||
return_url: '订单详情的地址' |
return_url: '订单详情的地址' |
||||
} |
} |
||||
} |
} |
||||
}, |
}, |
||||
methods: { |
methods: { |
||||
wxPay(order, o) { |
wxPay(order, o) { |
||||
|
|
||||
wx.requestPayment({ |
wx.requestPayment({ |
||||
appId: order.appid, |
appId: order.appid, |
||||
timeStamp: order.timeStamp, //创建订单时间戳 |
timeStamp: order.timeStamp, //创建订单时间戳 |
||||
nonceStr: order.nonceStr, |
nonceStr: order.nonceStr, |
||||
package: order.package, // 订单包 |
package: order.package, // 订单包 |
||||
signType: order.signType, // 加密方式统一'MD5' |
signType: order.signType, // 加密方式统一'MD5' |
||||
paySign: order.sign, // 后台支付签名返回 |
paySign: order.sign, // 后台支付签名返回 |
||||
success(res) { |
success(res) { |
||||
// 数据源转换成字符 |
// 数据源转换成字符 |
||||
let data = JSON.stringify(o) |
let data = JSON.stringify(o) |
||||
// 转码传输 |
// 转码传输 |
||||
let value = encodeURIComponent(data) |
let value = encodeURIComponent(data) |
||||
uni.redirectTo({ |
uni.redirectTo({ |
||||
url: '/uni_modules/common-pay/pages/success/success?data=' + |
url: '/uni_modules/common-pay/pages/success/success?data=' + |
||||
value |
value |
||||
}) |
}) |
||||
}, |
}, |
||||
fail(res) { |
fail(res) { |
||||
try { |
try { |
||||
if (err.errMsg != 'requestPayment:fail cancel') { |
if (err.errMsg != 'requestPayment:fail cancel') { |
||||
uni.showToast({ |
uni.showToast({ |
||||
icon: 'error', |
icon: 'error', |
||||
title: '支付失败' |
title: '支付失败' |
||||
}) |
}) |
||||
} |
} |
||||
} catch (e) { |
} catch (e) { |
||||
//TODO handle the exception |
//TODO handle the exception |
||||
} |
} |
||||
} |
} |
||||
}) |
}) |
||||
}, |
}, |
||||
convertSecondsToHMS(seconds) { |
convertSecondsToHMS(seconds) { |
||||
var hours = Math.floor(seconds / (60 * 60)); // 计算小时 |
var hours = Math.floor(seconds / (60 * 60)); // 计算小时 |
||||
seconds %= (60 * 60); // 取余得到不足1小时的秒数 |
seconds %= (60 * 60); // 取余得到不足1小时的秒数 |
||||
|
|
||||
var minutes = Math.floor(seconds / 60); // 计算分钟 |
var minutes = Math.floor(seconds / 60); // 计算分钟 |
||||
seconds %= 60; // 取余得到不足1分钟的秒数 |
seconds %= 60; // 取余得到不足1分钟的秒数 |
||||
|
|
||||
let result = '支付剩余时间 ' |
let result = '支付剩余时间 ' |
||||
if (hours > 0) { |
if (hours > 0) { |
||||
result += (hours < 10 ? '0' + hours : hours) + ":" + (minutes < 10 ? '0' + minutes : minutes) + ":" + ( |
result += (hours < 10 ? '0' + hours : hours) + ":" + (minutes < 10 ? '0' + minutes : minutes) + |
||||
seconds < 10 ? '0' + seconds : seconds) |
":" + ( |
||||
} else { |
seconds < 10 ? '0' + seconds : seconds) |
||||
// 不显示小时，直接显示 分钟：秒 |
} else { |
||||
if (minutes > 0) { |
// 不显示小时，直接显示 分钟：秒 |
||||
result += (minutes < 10 ? '0' + minutes : minutes) + ":" + (seconds < 10 ? '0' + seconds : seconds) |
if (minutes > 0) { |
||||
} else { |
result += (minutes < 10 ? '0' + minutes : minutes) + ":" + (seconds < 10 ? '0' + seconds : |
||||
result += "00:" + (seconds < 10 ? '0' + seconds : seconds) |
seconds) |
||||
} |
} else { |
||||
} |
result += "00:" + (seconds < 10 ? '0' + seconds : seconds) |
||||
|
} |
||||
return result |
} |
||||
}, |
|
||||
startCountdown() { |
return result |
||||
setInterval(() => { |
}, |
||||
if (this.page.countdown > 0) { |
startCountdown() { |
||||
this.page.countdown--; |
setInterval(() => { |
||||
} else { |
if (this.page.countdown > 0) { |
||||
// 秒杀倒计时结束的操作，例如弹出提示或触发秒杀请求 |
this.page.countdown--; |
||||
this.page.submitText = this.page.cancleText |
} else { |
||||
} |
// 秒杀倒计时结束的操作，例如弹出提示或触发秒杀请求 |
||||
}, 1000); |
this.page.submitText = this.page.cancleText |
||||
}, |
} |
||||
radioChange: function(evt) { |
}, 1000); |
||||
this.page.selected = parseInt(evt.detail.value) |
}, |
||||
}, |
radioChange: function(evt) { |
||||
createOrder() { |
this.page.selected = parseInt(evt.detail.value) |
||||
|
}, |
||||
if (this.page.cancleText === this.page.submitText) { |
createOrder() { |
||||
uni.showToast({ |
|
||||
icon: 'error', |
if (this.page.cancleText === this.page.submitText) { |
||||
title: this.page.cancleText |
uni.showToast({ |
||||
}) |
icon: 'error', |
||||
return |
title: this.page.cancleText |
||||
} |
}) |
||||
|
return |
||||
// 额外组装type |
} |
||||
let payType = this.page.real[this.page.selected].payType |
|
||||
this.data.pay_url.params.type = payType |
// 额外组装type |
||||
|
let payType = this.page.real[this.page.selected].payType |
||||
let o = this.data |
this.data.pay_url.params.type = payType |
||||
o.color = this.page.real[this.page.selected].btnColor |
|
||||
o.pay = this.page.real[this.page.selected].pay |
let o = this.data |
||||
|
o.color = this.page.real[this.page.selected].btnColor |
||||
http({ |
o.pay = this.page.real[this.page.selected].pay |
||||
url: this.data.pay_url.url, |
|
||||
data: this.data.pay_url.params |
http({ |
||||
}).then((res) => { |
url: this.data.pay_url.url, |
||||
if ('wxpay' === payType) { |
data: this.data.pay_url.params |
||||
this.wxPay(res.data, o) |
}).then((res) => { |
||||
} |
if ('wxpay' === payType) { |
||||
}).catch((err) => { |
this.wxPay(res.data, o) |
||||
console.log('fail', JSON.stringify(err)); |
} |
||||
}); |
}).catch((err) => { |
||||
} |
console.log('fail', JSON.stringify(err)); |
||||
}, |
}); |
||||
onLoad(options) { |
} |
||||
|
}, |
||||
try { |
onLoad(options) { |
||||
// 跳转携带数据 |
|
||||
this.data = JSON.parse(options.data) |
try { |
||||
} catch (e) { |
// 跳转携带数据 |
||||
this.data = JSON.parse(decodeURIComponent(options.data)) |
this.data = JSON.parse(options.data) |
||||
} |
} catch (e) { |
||||
|
this.data = JSON.parse(decodeURIComponent(options.data)) |
||||
this.page.countdown = this.data.remainder; |
} |
||||
if (this.page.countdown <= 0) { |
|
||||
this.page.submitText = this.page.cancleText |
this.page.countdown = this.data.remainder; |
||||
} else { |
if (this.page.countdown <= 0) { |
||||
// 开始倒计时 |
this.page.submitText = this.page.cancleText |
||||
this.startCountdown(); |
} else { |
||||
} |
// 开始倒计时 |
||||
|
this.startCountdown(); |
||||
// ToDo h5，app下生效 |
} |
||||
// 将来支持配置 |
|
||||
// #ifdef APP || H5 |
// ToDo h5，app下生效 |
||||
|
// 将来支持配置 |
||||
// #endif |
// #ifdef APP || H5 |
||||
// 微信下生效 |
|
||||
// #ifdef MP-WEIXIN |
// #endif |
||||
// 微信不支持配置 |
// 微信下生效 |
||||
this.page.use = [0] |
// #ifdef MP-WEIXIN |
||||
// #endif |
// 微信不支持配置 |
||||
|
this.page.use = [0] |
||||
for (var i = 0; i < this.page.use.length; i++) { |
// #endif |
||||
this.page.real.push(this.page.supports[this.page.use[i]]) |
|
||||
} |
for (var i = 0; i < this.page.use.length; i++) { |
||||
|
this.page.real.push(this.page.supports[this.page.use[i]]) |
||||
if (this.page.real.length < 1) { |
} |
||||
uni.showModal({ |
|
||||
content: '未正确配置支付方式', |
if (this.page.real.length < 1) { |
||||
showCancel: false, |
uni.showModal({ |
||||
success: function(res) { |
content: '未正确配置支付方式', |
||||
if (res.confirm) { |
showCancel: false, |
||||
uni.navigateBack() |
success: function(res) { |
||||
} |
if (res.confirm) { |
||||
} |
uni.navigateBack() |
||||
}); |
} |
||||
return |
} |
||||
} |
}); |
||||
|
return |
||||
// if (this.page.real.length == 1) { |
} |
||||
// // 仅有一个选择时直接调用支付接口 |
|
||||
// this.createOrder() |
// if (this.page.real.length == 1) { |
||||
// } |
// // 仅有一个选择时直接调用支付接口 |
||||
} |
// this.createOrder() |
||||
} |
// } |
||||
|
} |
||||
|
} |
||||
</script> |
</script> |
||||
|
|
||||
<style> |
<style> |
||||
uni-page-body, |
uni-page-body, |
||||
page { |
page { |
||||
background-color: #f1f3f5; |
background-color: #f1f3f5; |
||||
height: 100%; |
height: 100%; |
||||
} |
} |
||||
|
|
||||
.btn { |
.btn { |
||||
width: calc(100% - 40rpx); |
width: calc(100% - 40rpx); |
||||
height: 80rpx; |
height: 80rpx; |
||||
line-height: 80rpx; |
line-height: 80rpx; |
||||
text-align: center; |
text-align: center; |
||||
font-size: 28rpx; |
font-size: 28rpx; |
||||
border-radius: 50rpx; |
border-radius: 50rpx; |
||||
margin-bottom: 30rpx; |
margin-bottom: 30rpx; |
||||
margin-top: 30rpx; |
margin-top: 30rpx; |
||||
color: #fff; |
color: #fff; |
||||
} |
} |
||||
</style> |
</style> |
||||
File diff suppressed because it is too large
Loading…
Reference in new issue