czg_team/cashier_wx
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

优惠卷和商品卷

Browse Source
This commit is contained in:
wwz
2025-03-10 16:33:43 +08:00
parent 70edc6756d
commit 5342133cbd
30 changed files with 2820 additions and 3338 deletions
Download Patch File Download Diff File Expand all files Collapse all files

676
pages/order/components/orderInfoAfter.vue
View File

@@ -4,6 +4,46 @@
<view class="card_head_box">
<view class="card_head_item" v-for="(item,index) in 8" :key="index"></view>
</view>
<!-- 先付款 -->
<view class="tabBox">
<view class="tab">
<view v-for="(item,index) in tebtypeList" :key="index"
:class="is_type==index?'tab_item'+(is_type+1)+' tab_item active ':'tab_item'"
@click="tabClick(item,index)">
<view></view>
<image class="icon" :src="is_type==index?item.url_active:item.url" mode="aspectFill" />
<text class="title" :class="{active:is_type==index}">{{item.title}}</text>
</view>
</view>
<view class="table" v-if=" is_type == 0 ">
<view class="table_left">
<image class="icon"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/confirmOrder/table.png"
mode="aspectFill" />
<text class="title">桌台</text>
</view>
<view class="value" v-if="listinfo.tableName"> {{ listinfo.tableName || '' }} </view>
</view>
<!-- <view class="pack" v-else>
<view class="top">
<text class="title">{{ shopInfo.shopName }}</text>
<text class="address">{{ shopInfo.address }}</text>
</view>
<view class="list">
<view class="item">
<view class="lable">取餐时间</view>
<view class="text">立即取餐</view>
</view>
<view class="item">
<view class="lable">预留电话</view>
<view class="getPhone text"><u-input class="inputVal" v-model="order.phone"
input-align="right" placeholder="请输入预留电话以便联系您"></u-input><text
class="getBtn">获取手机号</text></view>
</view>
</view>
</view> -->
</view>
<view class="card">
<!-- 订单头部 -->
<view class="card_item" v-for="(value, key) in listinfo.detailMap" :key="key">
@@ -29,58 +69,84 @@
</view>
<view class="price">
<view class="priceAmount">￥{{item.priceAmount}}</view>
<view class="priceAmount">
￥{{orderVIP.isVip ==1 && ordershopUserInfo.isMemberPrice==1?item.memberPrice:item.price}}
</view>
<view class="num">x{{item.num}}</view>
</view>
</view>
</view>
<view class="status" v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'">未付款</view>
<view class="totalAmount">
<!--<view class="status" v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'">未付款</view>
<view class="totalAmount">
<view class="label">小计￥</view>
<view class="price"> {{item.totalAmount}} </view>
</view>
</view> -->
<view class="semicircle_icon" v-if="index > 0">
<view class="semicircle_left_icon"></view>
<view class="semicircle_right_icon"></view>
</view>
</view>
<view class="cell-item" v-if="listinfo.seatCount > 0">
<view class="label">餐位费</view>
<view class="cell-item" v-if="is_type != 0">
<view class="label">打包费</view>
<view class="val">
<view>X{{listinfo.seatCount}}</view>
<view></view>
<view style="font-size: 28rpx;">￥</view>
<view>{{listinfo.seatAmount}}</view>
<view>{{listinfo.packFee}}</view>
</view>
</view>
<!-- isTableFee == 0是不免除 -->
<view class="cell-item"
v-if="ordershopUserInfo.isTableFee == 0 && is_type == 0 && listinfo.Seatcharge != 0">
<view class="label">餐位费</view>
<view class="val">
<view>X{{listinfo.Seatcharge}}</view>
<view style="font-size: 28rpx;">￥</view>
<view>{{listinfo.Seatcharge}}</view>
</view>
</view>
<!-- <view class="cell-item" v-else>
<view class="label">免餐位费</view>
<view class="val">
<view></view>
<view style="font-size: 28rpx;">￥</view>
<view>{{listinfo.Seatcharge}}</view>
</view>
</view> -->
<!-- 支付之前 -->
<block v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'">
<view v-for="(item,indexe) in favorable" :key="indexe">
<view v-if="!rechargeFreeChecked" class="favorable"
:class="{column:item.value.length>0&&item.type=='product'}" @click="goUrl(item)">
<view v-for="(item,indexe) in favorablelist" :key="indexe">
<view class="favorable" :class="{column:item.value.length>0&&item.type=='product'}"
@click="goUrl(item)">
<view class="favorable_left">
<!-- <image class="icon" :src="item.url" mode="aspectFill"/> -->
<text class="name"> {{ item.name }} </text>
</view>
<view class="favorable_right" v-if="item.type=='coupon'">
<text class="favorable_right_text">{{item.value}}</text>
<up-icon name="arrow-right" color="#575B66" size="16"
v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'"></up-icon>
</view>
<view class="favorable_right" :class="{column:item.value.length>0}"
v-if="item.type=='product'">
<view :class="{column:item.value.length>0}">
<view class="favorable_right_text" v-for="(items,indexs) in item.value"
:key="indexs">
<text>{{items.name}}</text>
<text>X{{items.num}}</text>
<text>-￥{{items.discountAmount || 0}}</text>
<!-- 商品卷 -->
<view class="favorable_right" :class="{column:item.value}" v-if="item.type=='product'">
<view :class="{column:item.value}">
<view class="favorable_right_text" v-if="item.value.uniqueIds">
<text>{{item.value.uniqueIds}}个</text>
<text>-￥{{item.value.Productroll}}</text>
</view>
</view>
<up-icon name="arrow-right" color="#575B66" size="16"
style="margin-top: 5rpx;"></up-icon>
</view>
<!-- 优惠卷 -->
<view class="favorable_right" v-if="item.type=='coupon'">
<text class="favorable_right_text">{{item.value.name}}</text>
<up-icon name="arrow-right" color="#575B66" size="16"
v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'"></up-icon>
</view>
<!-- 积分 -->
<view class="favorable_right" v-if="item.type=='points'" @click.stop="pointsChange">
<text class="favorable_right_text" style="color: #666;margin-right: 16rpx;"
v-if="calcUsablePointsData.usable">
@@ -95,16 +161,15 @@
<up-checkbox-group iconPlacement="right" @change="pointsChange">
<up-checkbox v-model="isPointsChecked"
:disabled="freeCheck||!calcUsablePointsData.usable" :checked="isPointsChecked"
activeColor="#E8AD7B" shape="circle" icon-size="36" size="36">
activeColor="#E8AD7B" shape="circle" icon-size="18" size="18">
</up-checkbox>
</up-checkbox-group>
</view>
</view>
</view>
</block>
<block v-else>
<block v-for="(item,index) in listinfo.couponInfoList.fullReductionCoupon" :key="index">
<block v-for="(item,index) in listinfo.couponInfoList" :key="index">
<view class="cell-item" v-if="item.type == 1">
<view class="label">优惠券</view>
<view class="val">
@@ -114,11 +179,10 @@
</view>
</view>
</block>
<view class="cell-item column" v-if="listinfo.couponInfoList.productCoupon.length > 0">
<view class="cell-item column" v-if="listinfo.couponInfoList.length > 0">
<view class="label">商品券</view>
<view class="val column">
<view class="productCoupon" v-for="(item,index) in listinfo.couponInfoList.productCoupon"
:key="index">
<view class="productCoupon" v-for="(item,index) in listinfo.couponInfoList" :key="index">
<view class="name">{{item.name}}</view>
<view class="num">X{{item.finalUseNum}}</view>
<view class="amount">-￥{{item.finalDiscountAmount}}</view>
@@ -138,7 +202,7 @@
<view class="total-wrap">
<view>总计￥</view>
<view class="price"> {{listinfo.payAmount}} </view>
<view class="price"> {{listinfo.totalCost}} </view>
</view>
</view>
@@ -146,30 +210,30 @@
<view class="orderInfo">
<view class="row" @click="copyHandle(listinfo.orderNo)">
<text class="t">订单编号：</text>
<text class="info">{{listinfo.orderNo}}（点击复制）</text>
<text class="info"
style="overflow:hidden;text-overflow:ellipsis;white-space:nowrap;">{{listinfo.orderNo}}（点击复制）</text>
</view>
<view class="row">
<text class="t">下单时间：</text>
<text class="info">{{$u.timeFormat(listinfo.time, 'yyyy-mm-dd hh:MM:ss')}}</text>
<text class="info">{{$u.timeFormat(listinfo.updateTime, 'yyyy-mm-dd hh:MM:ss')}}</text>
</view>
<view class="row">
<!-- <view class="row">
<text class="t">下单门店：</text>
<text class="info">{{listinfo.name}}</text>
</view> -->
<view class="row" v-if="listinfo.dineMod">
<text class="t">用餐模式：</text>
<text class="info" v-if="listinfo.dineMod == 'dine-in'">堂食</text>
<text class="info" v-if="listinfo.dineMod == 'take-out'">外带</text>
<text class="info" v-if="listinfo.dineMod == 'take-away'">外卖</text>
</view>
<view class="row">
<text class="t">订单类型：</text>
<text class="info" v-if="listinfo.sendType == 'post'">快递</text>
<text class="info" v-if="listinfo.sendType == 'takeaway'">外卖</text>
<text class="info" v-if="listinfo.sendType == 'takeself'">自提</text>
<text class="info" v-if="listinfo.sendType == 'table'">堂食</text>
</view>
<view class="row">
<view class="row" v-if="listinfo.remark">
<text class="t">备注：</text>
<text class="info">{{ listinfo.remark || ""}}</text>
</view>
<view class="row">
<view class="row" v-if="listinfo.seatNum">
<text class="t">就餐人数：</text>
<text class="info">{{ listinfo.seatCount || ""}}</text>
<text class="info">{{ listinfo.seatNum || ""}}</text>
</view>
</view>
</view>
@@ -184,9 +248,13 @@
computed,
defineEmits,
watch,
watchEffect
watchEffect,
defineExpose
} from 'vue'
// 定义自定义事件
const emits = defineEmits(['customevent', 'istype']);
// teb 切换送餐和打包
const tebtypeList = reactive([{
title: "送餐到桌",
@@ -206,17 +274,16 @@
},
])
const favorable = reactive([{
name: "优惠券",
type: "coupon",
value: "",
url: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/confirmOrder/coupon.png"
},
{
const favorablelist = reactive([{
name: "商品券",
type: "product",
value: [],
url: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/confirmOrder/coupon.png"
}, {
name: "优惠券",
type: "coupon",
value: "",
url: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/confirmOrder/coupon.png"
},
// { name: "团购优惠", type: "group",value: "", url: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/confirmOrder/groupOffer.png"},
{
@@ -227,267 +294,90 @@
}
])
const props = defineProps({
rechargeFreeChecked: {
type: Boolean
},
freeCheck: {
type: Boolean
},
listinfo: {
type: Object
},
amountVIP: {
orderVIP: {
type: Object
},
})
const data = reactive({
calcUsablePointsData: null,
isShow: false,
payAmount: 0,
isPointsChecked: false,
userCouponInfos: [],
selectCouponData: [],
})
const childOnShow = () => {
console.log('isShow==', this.isShow)
if (!this.isShow) {
this.getCalcUsablePoints()
return;
ordershopUserInfo: {
type: Object,
default: {
isTableFee: 0
}
}
// uni.$on('couponItem',this.changeCoupon)
this.userCouponInfos = [];
this.favorable[0].value = ""
this.favorable[1].value = []
this.listinfo.payAmount = this.payAmount
this.selectCouponData = uni.cache.get('selectCouponData') || []
this.changeCoupon();
})
const calcUsablePointsData = reactive({
usable: '',
pointsNum: '',
equivalentPoints: '',
unusableReason: '',
})
const isPointsChecked = ref(false)
const is_type = ref(0)
// 监听送餐/打包切换
const tabClick = (item, index) => {
is_type.value = index
emits("istype", is_type.value)
// this.getchoseEatModel('tabClick', index, item);
}
// 操作优惠卷
const dataprocessing = (data) => {
if (data.typeOrder == 1) {
favorablelist[1].value = data.item
} else {
favorablelist[0].value = data
}
}
const childOnShow = () => {}
// * 监听优惠券/商品券选择
const changeCoupon = (data) => {
// 优惠券数据
let couponList = this.selectCouponData.filter(v => v.type == 1);
// 商品券列表
let productList = this.selectCouponData.filter(v => v.type == 2);
// 优惠券处理
if (couponList.length > 0) {
let couponData = couponList[0]
//不包含优惠券的金额
let currentPayAmount = (this.userCouponInfos.filter(v => v.type == 1).length > 0 ? Number(this.listinfo
.payAmount) + couponData.discountAmount : this.listinfo.payAmount)
// 判断优惠金额不能大于支付金额
if (couponData.discountAmount <= currentPayAmount) {
const changeCoupon = (data) => {}
// if ( this.isPointsChecked && this.calcUsablePointsData) {
// this.listinfo.payAmount = (this.listinfo.payAmount-(this.calcUsablePointsData.pointsNum/this.calcUsablePointsData.equivalentPoints)).toFixed(2);
// } else {
// this.listinfo.payAmount = (Number(this.listinfo.payAmount)+(this.calcUsablePointsData.pointsNum/this.calcUsablePointsData.equivalentPoints)).toFixed(2);
// }
this.listinfo.payAmount = (currentPayAmount - couponData.discountAmount).toFixed(2)
this.favorable[0].value = ('-￥' + couponData.discountAmount)
this.userCouponInfos.push({
userCouponId: couponData.id,
type: couponData.type,
discountAmount: couponData.discountAmount,
num: couponData.type == 1 ? 1 : couponData.num,
})
this.$emit("setPayAmount", {
payAmount: this.listinfo.payAmount,
userCouponInfos: this.userCouponInfos,
freeCheck: this.freeCheck,
calcUsablePointsData: this.calcUsablePointsData,
isPointsChecked: this.isPointsChecked,
})
} else {
uni.showToast({
title: "优惠券满减金额大于订单金额不可使用",
icon: "none",
})
}
}
// 商品券处理
if (productList.length > 0) {
//商品券使用数量
let payAmount = this.listinfo.payAmount
productList.map((item, index) => {
// 筛选选中商品券商品列表
let productDetails = this.listinfo.details.filter(v => v.productId == item.proId);
//金额从小到大排序
let minCouponList = productDetails.sort((a, b) => (a.memberPrice > 0 ? a.memberPrice : a
.salePrice) - (b.memberPrice > 0 ? b.memberPrice : b.salePrice))
// 商品数量
let productAllNum = 0;
let productNum = 0
let productPayAmount = 0
minCouponList.map((v, indexs) => {
productNum = 0;
productPayAmount = 0;
let productDetailsNum = 0;
productDetails.map((v, indexs) => {
productDetailsNum += v.num;
})
for (let i = 0; i < v.num; i++) {
if (productAllNum < productDetailsNum && productNum < item.num && ((v
.memberPrice > 0 ? v.memberPrice : v.price) <= (payAmount -
productPayAmount))) {
productNum++
productAllNum++
productPayAmount += v.memberPrice > 0 ? v.memberPrice : v.price
}
}
payAmount = payAmount - productPayAmount
})
if (productNum > 0) {
this.userCouponInfos.push({
userCouponId: item.id,
type: item.type,
productId: item.proId,
discountAmount: productPayAmount,
num: productNum,
})
this.favorable[1].value.push({
userCouponId: item.id,
name: item.name,
type: item.type,
productId: item.proId,
discountAmount: productPayAmount,
num: productNum,
})
}
})
}
this.setPayAmount()
}
const setPayAmount = (cartLists) => {
let tableFee;
// this.storeInfo.registerType == 'munchies'
if (this.userCouponInfos.length > 0) {
console.log(this.userCouponInfos)
this.userCouponInfos.forEach(item => {
if (item.type == 2) {
if (item.discountAmount && item.discountAmount > 0) {
this.listinfo.payAmount = (this.listinfo.payAmount - item.discountAmount).toFixed(
2)
}
}
})
}
this.isPointsChecked = false;
this.getCalcUsablePoints()
this.$emit("setPayAmount", {
payAmount: this.listinfo.payAmount,
userCouponInfos: this.userCouponInfos,
freeCheck: this.freeCheck,
calcUsablePointsData: this.calcUsablePointsData,
isPointsChecked: this.isPointsChecked,
})
}
const setPayAmount = (cartLists) => {}
// * 积分状态监听
const pointsChange = () => {
if (this.freeCheck || !this.calcUsablePointsData.usable) {
return;
}
this.isPointsChecked = !this.isPointsChecked
if (this.isPointsChecked) {
this.listinfo.payAmount = (this.listinfo.payAmount - (this.calcUsablePointsData.pointsNum / this
.calcUsablePointsData.equivalentPoints)).toFixed(2);
} else {
this.listinfo.payAmount = (Number(this.listinfo.payAmount) + (this.calcUsablePointsData.pointsNum /
this.calcUsablePointsData.equivalentPoints)).toFixed(2);
}
this.$emit("setPayAmount", {
payAmount: this.listinfo.payAmount,
userCouponInfos: this.userCouponInfos,
freeDisabled: this.freeDisabled,
freeCheck: this.freeCheck,
calcUsablePointsData: this.calcUsablePointsData,
isPointsChecked: this.isPointsChecked,
})
}
const pointsChange = () => {}
// 跳转
const goUrl = (item) => {
if (this.listinfo.status == 'unpaid' || this.listinfo.status == 'paying') {
let couopnInfo;
switch (item.type) {
case 'coupon':
let payAmount = this.listinfo.payAmount;
let couponList = this.userCouponInfos.filter(v => v.type == 1);
if (couponList.length > 0) {
payAmount = payAmount + couponList.discountAmount;
}
couopnInfo = {
payAmount: this.listinfo.payAmount,
userCouponInfos: this.userCouponInfos,
freeDisabled: this.freeDisabled,
freeCheck: this.freeCheck,
calcUsablePointsData: this.calcUsablePointsData,
isPointsChecked: this.isPointsChecked,
}
uni.pro.navigateTo('/pages/user/coupon', {
type: "orderInfo_coupon",
shopId: this.listinfo.shopId,
orderId: this.listinfo.id,
couopnInfo: JSON.stringify(couopnInfo),
payAmount: payAmount,
shoppingCart: JSON.stringify(this.listinfo.details),
productList: JSON.stringify(couponList)
})
break;
case 'product':
let productList = this.userCouponInfos.filter(v => v.type == 2);
couopnInfo = {
payAmount: this.listinfo.payAmount,
userCouponInfos: this.userCouponInfos,
freeDisabled: this.freeDisabled,
freeCheck: this.freeCheck,
calcUsablePointsData: this.calcUsablePointsData,
isPointsChecked: this.isPointsChecked,
}
uni.pro.navigateTo('/pages/user/coupon', {
type: "orderInfo_product",
shopId: this.listinfo.shopId,
orderId: this.listinfo.id,
couopnInfo: JSON.stringify(couopnInfo),
payAmount: this.listinfo.payAmount,
shoppingCart: JSON.stringify(this.listinfo.details),
productList: JSON.stringify(productList)
})
break;
}
switch (item.type) {
case 'coupon':
uni.pro.navigateTo('/pages/order/coupon', {
type: "confirm_order_coupon",
shopId: uni.cache.get('orderVIP').shopId,
shopUserId: props.orderVIP.id,
payAmount: props.listinfo.totalCost,
shoppingCart: JSON.stringify(props.listinfo.combinedArray)
})
break;
case 'product':
uni.pro.navigateTo('/pages/order/coupon', {
type: "confirm_order_product",
shopId: uni.cache.get('orderVIP').shopId,
shopUserId: props.orderVIP.id,
payAmount: props.listinfo.totalCost,
shoppingCart: JSON.stringify(props.listinfo.combinedArray)
})
break;
}
}
// * 获取积分相关信息
const getCalcUsablePoints = async () => {
let params = {
memberId: this.listinfo.memberId,
}
if (this.listinfo.pointsDiscountAmount) {
params.orderAmount = this.listinfo.payAmount + this.listinfo.pointsDiscountAmount
} else {
params.orderAmount = this.listinfo.payAmount
}
let res = await this.api.calcUsablePoints(params)
this.calcUsablePointsData = res.data;
if (this.calcUsablePointsData.usable && params.orderAmount >= this.calcUsablePointsData
.minPaymentAmount) {
this.calcUsablePointsData.pointsNum = this.calcUsablePointsData.accountPoints >= this
.calcUsablePointsData.maxUsablePoints ? this.calcUsablePointsData.maxUsablePoints : this
.calcUsablePointsData.accountPoints
}
}
const getCalcUsablePoints = async () => {}
// * 复制订单号
const copyHandle = (e) => {
@@ -501,9 +391,14 @@
}
});
}
// 将方法暴露给父组件
defineExpose({
dataprocessing
});
</script>
<style lang="scss">
<style lang="scss" scoped>
.card_box {
background-color: #fff;
// box-shadow: 0rpx 8rpx 12rpx 2rpx rgba(87,86,86,0.35);
@@ -514,6 +409,201 @@
border-radius: 18rpx;
padding-bottom: 32rpx;
.tabBox {
width: 100%;
margin-top: 52rpx;
position: relative;
z-index: 1;
.tab {
display: flex;
justify-content: space-between;
align-items: center;
border-radius: 22rpx 22rpx 0 0;
// background-color: $uni-bg-color;
.tab_item {
width: 50%;
height: 90rpx;
line-height: 90rpx;
display: flex;
align-items: center;
padding-left: 30rpx;
box-sizing: border-box;
background-color: #FEFBF8;
border-radius: 22rpx 22rpx 0 0;
position: relative;
.title {
font-weight: 500;
font-size: 28rpx;
color: #999999;
position: relative;
z-index: 1;
}
.title.active {
color: #E8AD7B;
}
.icon {
width: 48rpx;
height: 48rpx;
margin-right: 16rpx;
position: relative;
z-index: 1;
}
}
.tab_item.active {
background-color: #fff;
}
// .tab_item.active:after {
// content: "";
// position: absolute;
// top: 0;
// left: -4px;
// width: 40px;
// height: 26px;
// background: orange;
// }
.tab_item.active:before {
content: "";
position: absolute;
top: -20rpx;
left: 0;
right: 0;
bottom: 0;
border-radius: 2px;
background: #fff;
transform: skewX(0deg);
}
.tab_item1.active:before {
border-radius: 22rpx 40rpx 0 0;
}
.tab_item2.active:before {
border-radius: 40rpx 22rpx 0 0;
}
}
.table {
display: flex;
justify-content: space-between;
align-items: center;
padding: 0 30rpx;
box-sizing: border-box;
height: 90rpx;
background-color: $uni-bg-color;
border-radius: 0 0 22rpx 22rpx;
.table_left {
display: flex;
align-items: center;
.icon {
width: 32.86rpx;
height: 39.07rpx;
margin-right: 24rpx;
}
.title {
display: flex;
align-items: center;
color: #E8AD7B;
}
}
.value {
font-weight: 500;
font-size: 32rpx;
color: #333333;
}
}
.pack {
display: flex;
flex-direction: column;
padding: 30rpx;
box-sizing: border-box;
background-color: $uni-bg-color;
border-radius: 0 0 22rpx 22rpx;
.top {
display: flex;
flex-direction: column;
margin-top: 8rpx;
.title {
font-size: 28rpx;
color: #333;
font-weight: bold;
margin-bottom: 16rpx;
}
.address {
font-size: 24rpx;
font-weight: 400;
color: #999;
}
}
.list {
display: flex;
flex-direction: column;
.item {
height: 70rpx;
display: flex;
align-items: center;
justify-content: space-between;
font-size: 28rpx;
.lable {
color: #666;
font-weight: 500;
}
.getPhone {
display: flex;
align-items: center;
.u-input {
width: 340rpx;
border: none;
input {
font-size: 24rpx;
color: #333;
}
.input-placeholder {
font-size: 24rpx;
}
}
}
.text,
.getBtn {
color: #E8AD7B;
}
.getBtn {
border-radius: 12rpx;
border: 2rpx solid #E8AD7B;
padding: 8rpx 20rpx;
box-sizing: border-box;
}
}
}
}
}
.card_head_box {
width: 100%;
display: flex;

223
pages/order/components/paymentMethod.vue
View File

@@ -1,223 +0,0 @@
<template>
<!-- 支付方式 -->
<view class="paymentMethod">
<view class="paymentMethod_content">
<view class="paymentMethod_title">支付方式</view>
<u-radio-group v-model="radiovalue" iconPlacement="right" @change="groupChange" :size="28"
placement="column">
<block v-for="(item,index) in paymentMethodList" :key="index">
<view class="method_list" @click="groupChange(item.type)">
<view class="method_list_top">
<view class="method_list_top_left">
<image class="icon" :src="item.url" mode="aspectFill"/>
<view class="method_list_top_cen">
<view class="name"> {{ item.name }} </view>
<view class="method_list_bom" v-if="item.type == 1">
<text class="balance">会员卡余额 ￥{{amountVIP?amountVIP.amount:0}}</text>
<text class="topUpNow" @click="goRecharge">去充值</text>
</view>
</view>
</view>
<u-radio activeColor="#E8AD7B" :disabled="(freeCheck&&index==0) || (index!=0&&payAmount<=0) || (rechargeFreeChecked&&index==0)" icon-size="36" size="36" :name="item.type">
</u-radio>
</view>
</view>
</block>
</u-radio-group>
</view>
</view>
</template>
<script>
export default {
data() {
return {
paymentMethodList:[
{ name: "余额支付", type: 1, url: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/wechat.png"},
// #ifdef MP-WEIXIN
{ name: "微信支付", type: 2, url: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/confirmOrder/weChat.png"},
// #endif
// #ifdef MP-ALIPAY
{ name: "支付宝支付", type: 3, url: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/confirmOrder/alipay.png"},
// #endif
],
paymentMethodName:[
{ name: "余额支付", type: 1, url: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/wechat.png"},
{ name: "微信支付", type: 2, url: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/confirmOrder/weChat.png"},
{ name: "支付宝支付", type: 3, url: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/confirmOrder/alipay.png"},
],
radiovalue: 1, // 支付方式
ispws: false, // 输入支付密码
storeInfo: {},
}
},
props:{
rechargeFreeChecked:{
type: Boolean
},
payAmount:{
type: Number
},
amountVIP:{
type: Object
},
freeCheck: {
type: Boolean
}
},
watch: {
// freeCheck(newVal,oldVal) {
// if ( newVal ) {
// // #ifdef MP-WEIXIN
// this.radiovalue = 2
// // #endif
// // #ifdef MP-ALIPAY
// this.radiovalue = 3
// // #endif
// let name = this.paymentMethodName[this.radiovalue-1].name;
// console.log({type:this.radiovalue ,name: name })
// this.$emit("groupChange",{type:this.radiovalue ,name: name })
// }
// }
payAmount:{
immediate: true,
handler (newVal) {
if ( newVal <= 0 ) {
this.radiovalue = 1
let name = this.paymentMethodName[this.radiovalue-1].name;
this.$emit("groupChange",{type:this.radiovalue ,name: name })
}
}
},
rechargeFreeChecked:{
immediate: true,
handler (newVal) {
if ( newVal ) {
// #ifdef MP-WEIXIN
this.radiovalue = 2
// #endif
// #ifdef MP-ALIPAY
this.radiovalue = 3
// #endif
let name = this.paymentMethodName[this.radiovalue-1].name;
this.$emit("groupChange",{type:this.radiovalue ,name: name })
}
}
},
freeCheck:{
immediate: true,
handler (newVal) {
if ( newVal ) {
// #ifdef MP-WEIXIN
this.radiovalue = 2
// #endif
// #ifdef MP-ALIPAY
this.radiovalue = 3
// #endif
let name = this.paymentMethodName[this.radiovalue-1].name;
this.$emit("groupChange",{type:this.radiovalue ,name: name })
}
}
},
},
mounted() {
// console.log(this.amountVIP)
// this.getAount();
},
methods: {
/**
* 监听支付方式切换
* @param {Object}
*/
groupChange(type) {
if ( this.freeCheck && type == 1 ) {
return;
}
if ( this.payAmount<=0 && type != 1 ) {
return;
}
this.radiovalue = type;
let name = this.paymentMethodName[type-1].name;
this.$emit("groupChange",{type:type ,name: name })
},
/**
* 去充值
*/
goRecharge() {
uni.pro.navigateTo('/pages/member/index', {
shopId: uni.cache.get('shopId')
})
},
}
}
</script>
<style lang="scss">
.paymentMethod{
box-sizing: border-box;
margin-top: 30rpx;
border-radius: 18rpx;
.paymentMethod_content{
background-color: #fff;
border-radius: 22rpx;
padding:30rpx 30rpx 0 30rpx;
box-sizing: border-box;
.paymentMethod_title{
font-weight: 500;
font-size: 32rpx;
color: #333333;
box-sizing: border-box;
}
.method_list{
padding: 40rpx 0;
box-sizing: border-box;
.method_list_top{
display: flex;
justify-content: space-between;
.method_list_top_left{
display: flex;
align-items: center;
.icon{
width: 54.67rpx!important;
height: 48rpx!important;
margin-right: 22rpx;
}
.name{
font-size: 32rpx;
font-weight: 500;
color: #333;
}
.method_list_top_cen{
display: flex;
flex-direction: column;
}
}
}
.method_list_bom{
display: flex;
align-items: center;
.balance{
margin-right: 20rpx;
font-size: 24rpx;
}
.topUpNow{
color: #FF803D;
font-size: 28rpx;
}
}
}
.method_list:nth-child(odd){
border-bottom: 2rpx solid #e5e5e5;
}
}
}
</style>

572
pages/order/coupon.vue Normal file
View File

@@ -0,0 +1,572 @@
<template>
<view class="container">
<view class="containertop">
<view class="containertopbox">
<view class="containertopboxitem flex-start" v-for="(item,index) in fromInfo.list" :key="index">
<view class="containertopboxitemleft flex-colum"
:class="{'containertopboxitemleft_vip': item.type == 2,'containertopboxitemlefts': fromInfo.status != 1,}">
<view class="containertopboxitemleft_one" v-if="Orderinfo.typeOrder == 1"
:class="Orderinfo.typeOrder == 1 ?'':'containertopboxitemleft_ones'">
<block v-if="item.type == 2">
<text>{{item.num || 0}}</text>
<text style="font-size: 28rpx;margin-left: 6rpx;">张</text>
</block>
<block v-else>
<text style="font-size: 28rpx;margin-right: 6rpx;">￥</text>
<text>{{item.discountAmount || 0}}</text>
</block>
</view>
<view class="containertopboxitemleft_tow"
:class="{'containertopboxitemleft_nameVip': item.type == 2}">
{{ item.type == 2 ? item.name : '优惠券(元)'}}
</view>
</view>
<view class="containertopboxitemright">
<view class="containertopboxitemright_one">
<view class="flex-start">
<image class="icon"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/user/coupon_icon.png"
mode="aspectFill"></image>
<text class="title">{{ item.shopName }}</text>
</view>
<!-- 商品卷显示 -->
<text v-if="Orderinfo.typeOrder == 2">无门槛使用</text>
</view>
<view class="containertopboxitemright_tow">
<view> {{ item.type == 2 ? '会员商品券' : item.name}}</view>
<!-- 优惠卷 -->
<view @click="navigatorGo(item)" v-if="Orderinfo.typeOrder == 1"
class="containertopboxitemright_four containertopboxitemright_btn"
style="padding: 10rpx 15rpx;">
去使用
</view>
<!-- 商品卷 -->
<view @click="clickupicon(item,index)" v-if="Orderinfo.typeOrder == 2 && item.show"
class="containertopboxitemright_btn">
<up-icon v-if="item.Selected" name="checkmark-circle-fill" color="#2979ff"
size="28"></up-icon>
<view v-else class="upicon"></view>
</view>
<view v-if="Orderinfo.typeOrder == 2 && !item.show" class="containertopboxitemright_fours">
不可使用
</view>
</view>
<view class="containertopboxitemright_there">
有效期至：{{item.endTime}}
</view>
</view>
</view>
<view v-if="fromInfo.list.length <= 0" style="text-align: center;">
<image style="width: 402rpx;height: 442rpx;margin:240rpx auto 32rpx;"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/nomore.png" mode="aspectFill"></image>
</view>
</view>
</view>
<view style="height:120rpx;" v-if="Orderinfo.typeOrder == 2"></view>
<view class="btnBox" v-if="Orderinfo.typeOrder == 2">
<view class="btn" @click="cancelCoupon">确定</view>
</view>
</view>
</template>
<script setup>
import {
ref,
reactive,
onMounted,
} from 'vue';
import {
onLoad,
onReady,
onShow,
} from '@dcloudio/uni-app'
import {
APIcouponfindByUserId,
APIfindCoupon
} from '@/common/api/member.js'
const fromInfo = reactive({
tabIndex: 0,
list: [],
status: 1,
shopId: null,
orderId: null,
couopnInfo: null,
shoppingCart: [],
productList: [],
})
// 判断是选择优惠卷
const Orderinfo = reactive({
typeOrder: '',
shopUserId: "",
payAmount: "",
shoppingCart: [],
show: false
})
// 去使用优惠券
const navigatorGo = (item) => {
console.log(Orderinfo.payAmount, item)
if (Orderinfo.payAmount < item.fullAmount) {
uni.showToast({
title: "当前订单金额不足使用金额",
icon: "none",
})
return;
}
if (Orderinfo.payAmount < item.discountAmount) {
uni.showToast({
title: "当前订单金额不足抵扣金额",
icon: "none",
})
return;
}
uni.$emit('returnData', {
typeOrder: Orderinfo.typeOrder,
item,
});
uni.navigateBack({
delta: 1
});
}
const Selectedlist = ref([])
// 商品卷
const clickupicon = async (item, index) => {
lowestPrices.value = []
if (!item.show) {
return false;
}
console.log(Orderinfo.shoppingCart)
if (Orderinfo.shoppingCart.length < Selectedlist.value.length) {
uni.showToast({
title: '不可多余下单参数哦！'
})
}
if (item.Selected) {
Selectedlist.value = Selectedlist.value.filter(i => i.id !== item.id)
} else {
// 筛查出最低价格
await productmethod()
const matchedItem = lowestPrices.value.find(cartItem => cartItem.productId == item.proId);
Selectedlist.value.push({
...item,
price: matchedItem.price,
memberPrice: matchedItem.memberPrice
})
}
fromInfo.list[index].Selected = !item.Selected
}
// 这是判断是否符合选中规格
const groupByPropertyAndCount = (arr, property) => {
// 创建一个空对象来存储每个属性值对应的数量
const propertyMap = {};
// 遍历原始数组
arr.forEach(item => {
const key = item[property];
const num = item.number || 1;
if (!propertyMap[key]) {
// 如果该属性值还没有在 propertyMap 中，初始化一个对象
propertyMap[key] = {
value: item[property],
count: num
};
} else {
// 如果该属性值已经存在，增加数量
propertyMap[key].count += num;
}
});
// 将 propertyMap 中的结果转换为数组
return Object.values(propertyMap);
}
// 存储每个 productId 对应的最低价格
const lowestPrices = ref([]);
// 筛选出携带的商品是否有相同的商品 productId
const productmethod = () => {
const groupedProducts = {};
// 第一步：将相同 productId 的商品分组
Orderinfo.shoppingCart.forEach(product => {
const {
productId
} = product;
if (!groupedProducts[productId]) {
groupedProducts[productId] = [];
}
groupedProducts[productId].push(product);
});
// 第二步：遍历每个分组，找出最低价格
for (const productId in groupedProducts) {
let minPrice = Infinity;
let minMemberPrice = Infinity;
groupedProducts[productId].forEach(product => {
if (product.price < minPrice) {
minPrice = product.price;
minMemberPrice = product.memberPrice;
}
});
// 将每个 productId 的最低价格信息添加到 lowestPrices 数组中
lowestPrices.value.push({
productId: Number(productId),
price: minPrice,
memberPrice: minMemberPrice
});
}
}
const getCouponList = async () => {
let res = await APIfindCoupon({
type: Orderinfo.typeOrder,
shopUserId: Orderinfo.shopUserId,
})
if (Orderinfo.typeOrder == 2) {
res.forEach((item) => {
item.Selected = false
})
res = res.map(item => {
const matchedItem = Orderinfo.shoppingCart.find(cartItem => cartItem.productId == item
.proId);
const hasMatch = Boolean(matchedItem);
return {
...item,
show: hasMatch,
price: hasMatch ? matchedItem.price : undefined,
memberPrice: hasMatch ? matchedItem.memberPrice : undefined
};
});
}
if (!res) {
fromInfo.list = []
return false
}
fromInfo.list = res
console.log(res)
}
const cancelCoupon = () => {
uni.$emit('returnData', Selectedlist.value);
uni.navigateBack({
delta: 1
});
}
onMounted(async () => {
// 获取当前页面栈
const pages = getCurrentPages();
// 获取当前页面实例
const currentPage = pages[pages.length - 1];
// 获取页面参数
const options = currentPage.options;
if (options.shopId) {
fromInfo.shopId = options.shopId
}
if (options.type) {
Orderinfo.typeOrder = options.type == 'confirm_order_product' ? 2 : 1
uni.setNavigationBarTitle({
title: Orderinfo.typeOrder == 2 ? '商品卷' : '优惠卷',
success: () => {
console.log('导航栏标题修改成功');
},
fail: (err) => {
console.error('导航栏标题修改失败', err);
}
});
Orderinfo.shopUserId = options.shopUserId
Orderinfo.payAmount = options.payAmount
Orderinfo.shoppingCart = JSON.parse(decodeURIComponent(options.shoppingCart))
}
getCouponList()
})
</script>
<style lang="scss">
page {
background: #fff;
}
.container {
.towcontent {
padding: 0 28rpx;
border-top: 16rpx solid #f7f7f7;
.towcontentlistxitem {
width: 100%;
margin-top: 32rpx;
.towcontentlistxitembox {
width: 33.33%;
font-family: PingFang SC, PingFang SC;
font-weight: 500;
font-size: 28rpx;
color: #333333;
justify-content: flex-start;
height: 50rpx;
image {
margin-top: 6rpx;
width: 38.83rpx;
height: 8.62rpx;
}
}
.towcontentlistxitemboxopacity {
font-weight: bold;
text {
color: #E3AD7F;
}
image {
margin-top: 6rpx;
width: 38.83rpx;
height: 8.62rpx;
}
}
}
}
.containertop {
padding: 40rpx 32rpx;
.containertopbox {
margin-top: 8rpx;
.containertopboxitem::after {
position: absolute;
bottom: 14rpx;
left: 14rpx;
content: '';
display: inline-block;
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/coupontop.png) no-repeat;
width: 72.83rpx;
height: 77.14rpx;
background-size: cover;
}
.containertopboxitem {
margin-bottom: 32rpx;
width: 100%;
position: relative;
border-radius: 18rpx;
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
overflow: hidden;
.containertopboxitemleft {
position: relative;
width: 182rpx;
height: 192rpx;
background: #E3AD7F;
border-radius: 18rpx 0rpx 0rpx 18rpx;
padding: 0 20rpx;
// ::before {
// content: '';
// position: absolute;
// bottom: 0rpx;
// left: 166rpx;
// background: #fff;
// display: inline-block;
// width: 32rpx;
// height: 16rpx;
// line-height: 32rpx;
// border-radius: 32rpx 32rpx 0 0;
// box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(255, 255, 255, 0.16);
// z-index: 999;
// }
.containertopboxitemleft_one {
text {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 60rpx;
color: #FFFFFF;
}
}
.containertopboxitemleft_ones {
text {
color: #999999;
}
}
.containertopboxitemleft_tow {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 24rpx;
color: #FFFFFF;
}
.containertopboxitemleft_nameVip {
color: #967152;
}
.containertopboxitemleft_tows {
color: #999999;
}
}
.containertopboxitemleft::after {
content: '';
position: absolute;
top: -20rpx;
left: 166rpx;
background: #fff;
display: inline-block;
width: 40rpx;
height: 40rpx;
border-radius: 50%;
box-shadow: inset 0rpx 1rpx 9rpx 21rpx rgba(0, 0, 0, 0.04);
z-index: 999;
}
.containertopboxitemleft::before {
content: '';
position: absolute;
bottom: -20rpx;
left: 166rpx;
background: #fff;
display: inline-block;
width: 40rpx;
height: 40rpx;
border-radius: 50%;
box-shadow: inset 0rpx 0rpx 15rpx 1rpx rgba(0, 0, 0, 0.1);
z-index: 999;
}
.containertopboxitemleft_vip {
background-color: #E1D4B2;
}
.containertopboxitemlefts {
background: #F7F7F7;
}
.containertopboxitemright {
position: relative;
padding: 0 32rpx;
flex: auto;
height: 192rpx;
background: #FFFFFF;
border-radius: 0rpx 18rpx 18rpx 0rpx;
.containertopboxitemright_one {
font-family: Source Han Sans CN, Source Han Sans CN;
padding: 16rpx 0 20rpx 0;
border-bottom: 1rpx dashed #707070;
display: flex;
justify-content: space-between;
align-items: center;
.icon {
width: 26rpx;
height: 26rpx;
margin-right: 14rpx;
}
text {
font-weight: bold;
font-size: 24rpx;
color: #666666;
}
.title {
color: #333;
}
}
.containertopboxitemright_tow {
margin-top: 24rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 32rpx;
color: #333333;
display: flex;
justify-content: space-between;
align-items: center;
}
.containertopboxitemright_there {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 24rpx;
color: #999999;
}
.containertopboxitemright_btn {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 24rpx;
border-radius: 24rpx 24rpx 24rpx 24rpx;
.upicon {
width: 40rpx;
height: 40rpx;
border-radius: 50%;
border: 1rpx solid #000;
}
}
.containertopboxitemright_four {
color: #FFFFFF;
background: #967152;
}
.containertopboxitemright_fours {
color: #999999;
background: #F7F7F7;
}
}
}
}
}
.select {
padding-bottom: 180rpx;
}
.btnBox {
width: 100%;
position: fixed;
bottom: 0;
left: 0;
z-index: 999;
background-color: #fff;
padding: 30rpx 30rpx 50rpx 30rpx;
.btn {
width: 100%;
height: 90rpx;
line-height: 90rpx;
text-align: center;
font-weight: bold;
font-size: 36rpx;
color: #FFFFFF;
border-radius: 12rpx;
background: #E3AD7F;
}
}
}
</style>

579
pages/order/detail.vue
View File

@@ -3,9 +3,8 @@
<view class="headStatus"
v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'||listinfo.status=='closed'">
<view class="status">
<u-icon name="checkmark-circle-fill" color="#03C061" size="46"></u-icon>
<up-icon name="checkmark-circle-fill" color="#03C061" size="23"></up-icon>
<view class="statusName" v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'">
<!-- {{listinfo.registerType == 'munchies'?'待支付':'下单成功'}} -->
待支付
</view>
<view class="statusName" v-if="listinfo.status=='closed'">已完成</view>
@@ -33,11 +32,10 @@
</view>
<!-- 先下单后支付 -->
<!-- <orderInfoAfter ref="orderInfoAfterRef" :amountVIP="amountVIP" :rechargeFreeChecked="rechargeFreeChecked"
:freeCheck="freeCheck" :listinfo="listinfo" @setPayAmount="setPayAmount"
v-if="listinfo.useType == 'dine-in-after'"></orderInfoAfter> -->
<orderInfoAfter ref="orderInfoAfterRef" :rechargeFreeChecked="rechargeFreeChecked" :freeCheck="freeCheck"
:listinfo="listinfo"></orderInfoAfter>
:listinfo="listinfo" :orderVIP="orderVIP" :ordershopUserInfo='ordershopUserInfo' @istype="istype">
</orderInfoAfter>
<!-- 先支付后下单 -->
<!-- <orderInfoBefore ref="orderInfoBefore" :listinfo="listinfo" v-else></orderInfoBefore> -->
<!-- 充值免单 -->
@@ -48,7 +46,7 @@
ref="rechargeFree"
:freeDisabled="freeDisabled"
:payAmount="listinfo.payAmount"
:freeDingConfig="listinfo.freeDingConfig" :shopUserInfo="amountVIP" @changeFree="changeFree"></rechargeFree>
:freeDingConfig="listinfo.freeDingConfig" :shopUserInfo="orderVIP" @changeFree="changeFree"></rechargeFree>
</block>
<block v-else>
<rechargeFree
@@ -57,42 +55,33 @@
ref="rechargeFree"
:freeDisabled="freeDisabled"
:payAmount="listinfo.payAmount"
:freeDingConfig="listinfo.freeDingConfig" :shopUserInfo="amountVIP" @changeFree="changeFree"></rechargeFree>
:freeDingConfig="listinfo.freeDingConfig" :shopUserInfo="orderVIP" @changeFree="changeFree"></rechargeFree>
</block>
<paymentMethod ref="paymentMethod" :rechargeFreeChecked="rechargeFreeChecked" v-if="amountVIP&&listinfo.status == 'unpaid' || listinfo.status == 'paying'" :freeCheck="freeCheck" :payAmount="listinfo.payAmount" :amountVIP="amountVIP" @groupChange="groupChange"></paymentMethod>
-->
</block> -->
<!-- 支付方式 -->
<paymentMethodes ref="paymentMethodref" :orderVIP="orderVIP" @groupChange="groupChange">
</paymentMethodes>
<!-- <paymentMethodes ref="paymentMethodes" :rechargeFreeChecked="rechargeFreeChecked"
v-if="orderVIP&&listinfo.status == 'unpaid' || listinfo.status == 'paying'" :freeCheck="freeCheck"
:payAmount="listinfo.payAmount" :orderVIP="orderVIP" @groupChange="groupChange"></paymentMethodes> -->
<view class="fixedview">
<view class="flex-between" v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'">
<view class="flex-between" v-if="listinfo.status == 'unpaid'">
<view class="fixedview_one flex-start">
<view class="fixedview_oneone"> 实付金额： </view>
<view class="fixedview_onetow">
<text>¥</text>{{listinfo.payAmount}}
<text>¥</text>{{listinfo.totalCost}}
</view>
</view>
<view class="fixedview_tow" @tap="$u.debounce(goToPay,1000)">
{{11}}
{{paymentmethod.paymentBtnText}}
</view>
</view>
</view>
<view style="width: 100%;height: 200rpx;"> </view>
<u-popup :show="ispws" :round="20" mode="bottom" @close="payClose" height="500" :safeAreaInsetBottom="false">
<view class="pay-info-wrap">
<view class="info-wrap flex-between">
<view class="close" @click="payClose">
<u-icon name="close" color="#999999" size="40"></u-icon>
</view>
<text class="title">请输入支付密码</text>
<view></view>
</view>
<view class="info-content">
<payPasswordtwo ref="payPwd" :payAmount="listinfo.payAmount" @accountPayevent="accountPayevent"
v-if="ispws"></payPasswordtwo>
</view>
</view>
</u-popup>
<payPassword :isShow="ispws" @inputComplete="accountPayevent" @close="ispws = false" />
</view>
</template>
@@ -100,7 +89,9 @@
import {
ref,
reactive,
onMounted
onMounted,
onUnmounted,
watchEffect
} from 'vue';
import {
@@ -108,6 +99,7 @@
} from '@/common/api/order/index.js'
import {
APIusershopInfodetail,
APIshopUserInfo
} from '@/common/api/member.js'
@@ -117,24 +109,30 @@
const cartStore = useCartStore()
// import payPasswordtwo from '@/components/payPasswordtwo.vue'
// 结账管理
import {
Memberpay
} from '@/stores/pay.js';
const storeMemberpay = Memberpay();
import payPassword from '@/components/payPassword.vue'
import orderInfoAfter from './components/orderInfoAfter.vue'
// import orderInfoBefore from '../components/orderInfoBefore.vue'
// import rechargeFree from '../components/rechargeFree.vue'
// import paymentMethod from '../components/paymentMethod.vue'
import paymentMethodes from '@/components/paymentMethod.vue'; //支付方式
// 输入支付密码
const ispws = ref(false)
// 支付方式切换
const paymentmethod = reactive({
radiovalue: 1,
paymentBtnText: "余额支付",
payType: ''
// 商品订单会员
const ordershopUserInfo = ref({
isTableFee: 0
})
// 是否显示商家二维码信息
try {
const shopQrcode = uni.cache.get('shopInfo').shopQrcode
const shopQrcode = ref(uni.cache.get('shopInfo').shopQrcode)
} catch (error) {
//TODO handle the exception
}
@@ -144,117 +142,87 @@
// 订单详情
const listinfo = reactive({
})
const listinfoId = ref('')
// 会员信息？
const amountVIP = reactive({})
//优惠卷信息
const couopnInfo = reactive({
combinedArray: {},
Productroll: 0,
coupondiscountAmount: "",
couponInfoList: ''
})
const freeDisabled = ref(false)
// 会员信息
const orderVIP = ref()
//判断是否是打包商品
const is_type = ref(0)
//打包商品切换
const istype = (newValue) => {
is_type.value = newValue;
};
//积分
const freeCheck = ref(false)
const rechargeFreeChecked = ref(false)
// * 获取订单详情接口
const orderorderInfo = async () => {
let res = await APIgetOrderById({
orderId: orderId.value
})
console.log(res)
if (res) {
Object.assign(listinfo, res);
console.log(listinfo)
if (listinfo.couponInfoList) {
listinfo.couponInfoList = JSON.parse(listinfo.couponInfoList)
}
// this.listinfoId = res.data.orderId;
// this.shopId = res.data.shopId;
// if (listinfo.useType == " ") {
// //堂食先付费
// }
// if (listinfo.freeDingConfig && listinfo.payAmount < listinfo.freeDingConfig
// .rechargeThreshold) {
// this.freeDisabled = true
// }
// console.log(listinfo)
// if (listinfo.useType == "dine-in-after") {
// console.log(this.$refs.orderInfoAfterRef)
// this.$nextTick(() => {
// this.$refs.orderInfoAfterRef.childOnShow();
// })
// }
// this.getAount();
}
}
const setPayAmount = (data) => {
console.log(data)
listinfo.payAmount = data.payAmount
this.couopnInfo = data;
this.freeDisabled = data.freeDisabled
this.freeCheck = data.freeCheck
if (listinfo.freeDingConfig && listinfo.payAmount < listinfo.freeDingConfig
.rechargeThreshold) {
this.freeDisabled = true
} else {
this.freeDisabled = false
}
}
// * 免单状态监听
const changeFree = (val) => {
// this.freeCheck = val;
this.rechargeFreeChecked = !val
if (this.rechargeFreeChecked) {
if (this.couopnInfo) {
if (this.couopnInfo.isPointsChecked) {
listinfo.payAmount = (Number(listinfo.payAmount) + (this.couopnInfo
.calcUsablePointsData.pointsNum / this.couopnInfo.calcUsablePointsData
.equivalentPoints)).toFixed(2);
}
let couponList = this.couopnInfo.userCouponInfos.filter(v => v.type == 1);
if (couponList.length > 0) {
listinfo.payAmount = (couponList.length > 0 ? Number(listinfo.payAmount) +
couponList[0].discountAmount : listinfo.payAmount)
}
let productList = this.couopnInfo.userCouponInfos.filter(v => v.type == 2);
if (productList.length > 0) {
productList.map(item => {
listinfo.payAmount = Number(listinfo.payAmount) + item.discountAmount
if (listinfo.status == 'unpaid') {
try {
let res = await APIhistoryOrder({
orderId: orderId.value
})
}
} catch (error) {}
// if (listinfo.couponInfoList) {
// listinfo.couponInfoList = JSON.parse(listinfo.couponInfoList)
// }
}
listinfo.payAmount = (listinfo.payAmount * listinfo.freeDingConfig.rechargeTimes)
.toFixed(2)
} else {
listinfo.payAmount = (listinfo.payAmount / listinfo.freeDingConfig.rechargeTimes)
.toFixed(2)
if (this.couopnInfo) {
this.couopnInfo.isPointsChecked = false;
let couponList = this.couopnInfo.userCouponInfos.filter(v => v.type == 1);
if (couponList.length > 0) {
listinfo.payAmount = (couponList.length > 0 ? Number(listinfo.payAmount) -
couponList[0].discountAmount : listinfo.payAmount)
}
let productList = this.couopnInfo.userCouponInfos.filter(v => v.type == 2);
if (productList.length > 0) {
productList.map(item => {
listinfo.payAmount = Number(listinfo.payAmount) - item.discountAmount
})
}
// 历史订单
if (listinfo.detailMap) {
let combinedArray = [];
for (const key in listinfo.detailMap) {
if (listinfo.detailMap.hasOwnProperty(key)) {
let subArray = listinfo.detailMap[key];
combinedArray = [...combinedArray, ...subArray]
}
}
listinfo.combinedArray = combinedArray
setTimeout(async () => {
listinfo.packFee = await cartStore.getTotalPackFee(listinfo.combinedArray)
// 计算购物车商品费用
listinfo.totalPrices = await cartStore.getTotalTotalPrices(listinfo.combinedArray)
// 餐位费listinfo.seatNum
listinfo.Seatcharge = await cartStore.getTotalSeatcharge(listinfo.seatNum)
})
}
}
}
// 监听价格算法
watchEffect(async () => {
if (listinfo.combinedArray.length > 0) {
//总价格
console.log(listinfo.combinedArray, listinfo.packFee, listinfo.totalPrices, listinfo.Seatcharge,
listinfo.Productroll, listinfo.coupondiscountAmount)
// 打包费packFee 计算购物车商品费用totalPrices 餐位费Seatcharge
let sum = (is_type.value != 0 ? listinfo.packFee : 0) + listinfo.totalPrices + (is_type.value ==
0 ? listinfo.Seatcharge : 0);
listinfo.originAmount = Math.round(sum * 100) / 100;
// 打包费packFee 计算购物车商品费用totalPrices 餐位费Seatcharge 商品卷Productroll 优惠卷coupondiscountAmount
let sums = (is_type.value != 0 ? listinfo.packFee : 0) + listinfo.totalPrices + (is_type.value ==
0 ? listinfo.Seatcharge : 0) - (listinfo.Productroll || 0) - (listinfo
.coupondiscountAmount || 0);
listinfo.totalCost = Math.round(sums * 100) / 100;
console.log(listinfo.totalCost)
// totalCost.value = Math.round(sums * 100) / 100;
}
});
const saveImage = (url) => {
uni.saveImage({
url: url,
@@ -267,22 +235,17 @@
});
}
// * 获取会员信息
const getAount = async () => {
let res = await this.api.shopUserInfo({
"shopId": listinfo.shopId,
"userId": uni.cache.get('userInfo').id,
})
if (res.code == 0) {
console.log("会员信息===", res)
this.amountVIP = res.data;
}
}
// 支付方式切换
const paymentmethod = reactive({
radiovalue: 1,
paymentBtnText: "余额支付",
payType: ''
})
// * 获取会员信息
const groupChange = async (e) => {
this.radiovalue = e.type;
this.paymentBtnText = e.name;
paymentmethod.radiovalue = e.type;
paymentmethod.paymentBtnText = e.name;
paymentmethod.payType = e.payType;
}
// * 去充值
@@ -292,250 +255,83 @@
})
}
// 操作下单时候
const orderInfoAfterRef = ref(null)
// 商品卷的id储存
const uniqueIds = ref([])
// 这是优惠卷传的值
const handleReturnData = async (data) => {
console.log(data)
// 这是优惠卷
if (data.typeOrder == 1) {
// 优惠卷减去的金额
listinfo.coupondiscountAmount = data.item.discountAmount
uniqueIds.value.push(data.item.id)
orderInfoAfterRef.value.dataprocessing(data)
} else {
// 筛选出商品卷的id
uniqueIds.value = [...uniqueIds.value, ...new Set(data.map(item => item.id))]
// 商品卷总价价格
listinfo.Productroll = await cartStore.getTotalProductroll(data)
let res = {
Productroll: listinfo.Productroll,
uniqueIds: uniqueIds.value.length
}
orderInfoAfterRef.value.dataprocessing(res)
}
};
// * 去支付
const goToPay = async () => {
if ((this.radiovalue == 2 || this.radiovalue == 3) && listinfo.payAmount <= 0) {
uni.showToast({
title: "支付金额必须大于0",
icon: 'none'
})
return;
// 余额支付
if (paymentmethod.payType == '') {
ispws.value = true
return false
}
if (this.couopnInfo) {
let params = {
shopId: listinfo.shopId,
orderId: listinfo.orderId,
userCouponInfos: this.couopnInfo.userCouponInfos,
}
if (this.couopnInfo.isPointsChecked && this.couopnInfo.calcUsablePointsData.pointsNum && this
.couopnInfo.calcUsablePointsData.pointsNum > 0) {
params.pointsNum = this.couopnInfo.calcUsablePointsData.pointsNum;
}
let res = await this.api.useCoupon(params)
let checkOrderPay = {
orderId: orderId.value,
vipPrice: orderVIP.value.isVip == 1 && ordershopUserInfo.value.isMemberPrice == 1 ? 1 :
0, //是否使用会员价0否1是
allPack: is_type.value == 0 ? 0 : 1, //是否整单打包
seatNum: is_type.value == 0 ? listinfo.seatNum : 0, //用餐人数
originAmount: listinfo.originAmount, //订单原金额（包含打包费+餐位费） 不含折扣价格
discountRatio: 1, //折扣比例(计算时 向上取整保留 两位小数) 写死1
discountAmount: 0, //手动优惠金额 写死0
productCouponDiscountAmount: listinfo.Productroll, //商品优惠券抵扣金额
fullCouponDiscountAmount: listinfo.coupondiscountAmount, //满减优惠券抵扣金额
couponList: uniqueIds.value, //用户使用的卡券
orderAmount: listinfo.totalCost, // 最中订单金额
roundAmount: 0, //抹零金额 减免多少钱
pointsDiscountAmount: 0, //积分抵扣金额(tb_points_basic_setting表)
pointsNum: 0, //(扣除各类折扣 enable_deduction后使用)
remark: '', //用户备注
}
if (this.radiovalue == 2 || this.radiovalue == 3) {
this.wechatPay() //微信支付
} else {
// 先判断是否设置支付密码。0是没设置。没设置的情况下跳转到设置页面。有的话输入支付密码
// console.log(isPwd,'是否设置了支付密码')
if (this.amountVIP.isVip == 0) { //非会员情况
this.goRecharge();
} else {
if (uni.cache.get('userInfo').isPwd == 0) {
uni.navigateTo({
url: '/pages/member/setPassword?shopUserInfo=' + JSON.stringify(this.amountVIP)
})
} else {
uni.hideLoading()
// this.payPasswordShow = false;
this.ispws = true
}
}
}
}
// * 取消支付
const payClose = async () => {
this.ispws = false;
console.log(2)
uni.showToast({
icon: 'none',
title: '取消支付'
let res = await storeMemberpay.actionsltPayOrder({
checkOrderPay,
payType: paymentmethod.payType,
buyerRemark: '',
returnUrl: ''
})
setTimeout(res => {
uni.switchTab({
url: '/pages/order/order'
});
}, 500)
if (res) {
await orderorderInfo()
// uni.redirectTo({
// url: '/order/detail?orderId=' + res.id
// });
}
}
// * 余额支付
// 余额支付
const accountPayevent = async (pwd) => {
this.ispws = false;
let res = await this.api.accountPay({
orderId: this.listinfoId,
memberId: this.amountVIP.id,
pwd: pwd
})
if (res.code == 0) {
// data ->1 支付成功
// ->2 余额不足
// ->3 未设置支付密码，
// ->4 不是会员，
if (res.data == 1) {
uni.showToast({
title: "支付成功",
icon: 'none'
})
let _this = this
uni.requestSubscribeMessage({
tmplIds: ["z0fUG7-jhSfYCrw6poOvSRzh4_hgnPkm_5C7E5s5bCQ",
"AV-KybUHaK3KtFVLqpy6PHccHBS7XeX__mOM4RbufnQ"
],
complete() {
uni.redirectTo({
url: '/pagesOrder/order_detail/index?orderId=' + _this.listinfoId
});
},
})
} else if (res.data == 2) {
uni.showToast({
title: "余额不足",
icon: 'none'
})
setTimeout(() => {
// 去充值
this.goRecharge()
}, 1500)
} else if (res.data == 3) {
uni.showToast({
title: "未设置支付密码",
icon: 'none'
})
setTimeout(() => {
uni.navigateTo({
url: '/pages/member/setPassword?shopUserInfo=' + JSON.stringify(this
.amountVIP)
})
}, 1500)
} else if (res.data == 4) {
uni.showToast({
title: "非会员请充值",
icon: 'none'
})
setTimeout(() => {
// 去充值
this.goRecharge()
}, 1500)
}
}
console.log('输入的密码是：', pwd);
ispws.value = false;
}
/**
* 微信支付
*/
const wechatPay = async () => {
let res;
console.log(this.rechargeFreeChecked)
if (!this.rechargeFreeChecked) {
res = await this.api.orderPay({
orderId: orderId.value,
// #ifdef MP-WEIXIN
payType: 'wechatPay',
// #endif
// #ifdef MP-ALIPAY
payType: 'aliPay',
// #endif
// payType: this.radiovalue == 2 ? 'wechatPay' : 'aliPay'
}) //判断是否支付成功
} else {
console.log(listinfo.payAmount)
res = await this.api.paymemeberIn({
shopId: listinfo.shopId,
amount: listinfo.payAmount,
orderId: orderId.value,
// #ifdef MP-WEIXIN
payType: 'wechatPay',
// #endif
// #ifdef MP-ALIPAY
payType: 'aliPay',
// #endif
// payType: this.radiovalue == 2 ? 'wechatPay' : 'aliPay'
}) //判断是否支付成功
}
if (res.code == 0) {
uni.showLoading({
title: '加载中',
mask: true
})
uni.requestPayment({
// #ifdef MP-WEIXIN
provider: 'wxpay', //支付类型-固定值
partnerid: res.data.appId, // 微信支付商户号
timeStamp: res.data.timeStamp, // 时间戳（单位：秒）
nonceStr: res.data.nonceStr, // 随机字符串
package: res.data.package, // 固定值
signType: res.data.signType, //固定值
paySign: res.data.paySign, //签名
// #endif
// #ifdef MP-ALIPAY
provider: 'alipay', //支付类型-固定值
orderInfo: res.data.tradeNo, // 微信支付商户号
// #endif
success: (res) => {
let _this = this
uni.showToast({
title: "支付成功"
})
// #ifdef MP-WEIXIN
uni.requestSubscribeMessage({
tmplIds: ['z0fUG7-jhSfYCrw6poOvSRzh4_hgnPkm_5C7E5s5bCQ'],
complete() {
_this.paymodfiyOrderInfo()
setTimeout(res => {
uni.hideLoading()
uni.switchTab({
url: '/pages/order/order'
});
}, 500)
},
})
// #endif
// #ifdef MP-ALIPAY
_this.paymodfiyOrderInfo()
uni.switchTab({
url: '/pages/order/order'
});
// #endif
},
fail: async (err) => {
let res = await this.api.cancelOrderPay({
orderId: orderId.value,
}) //判断是否支付成功
uni.showToast({
icon: 'none',
title: '支付失败'
})
setTimeout(res => {
uni.hideLoading()
uni.switchTab({
url: '/pages/order/order'
});
}, 500)
}
});
}
}
// * 支付完成后请求
const paymodfiyOrderInfo = async () => {
let res = await this.api.paymodfiyOrderInfo({
orderId: listinfo.orderId,
})
}
// * 复制订单号
const copyHandle = async (e) => {
uni.setClipboardData({
data: e,
success() {
uni.showToast({
title: '复制成功',
icon: 'none'
});
}
});
}
onUnmounted(() => {
uni.$off('returnData', handleReturnData);
});
onMounted(async () => {
// 获取当前页面栈
@@ -545,16 +341,25 @@
// 获取页面参数
const options = currentPage.options;
orderId.value = options.orderId
let res = await APIshopUserInfo({
shopId: options.shopId
})
cartStore.shopInfo = res.shopInfo
orderorderInfo()
if (options.shopId) {
// 每次进来全局更新shopId
uni.cache.set('shopId', options.shopId, 30)
uni.$on('returnData', handleReturnData);
// * 获取会员信息
let res = await APIshopUserInfo({
shopId: options.shopId
})
uni.cache.set('orderVIP', res)
uni.cache.set('ordershopUserInfo', res.shopInfo)
orderVIP.value = res
ordershopUserInfo.value = res.shopInfo
}
await orderorderInfo()
})
</script>
<style scoped lang="scss">
::v-deep page {
<style lang="scss">
page {
background-color: #F7F7F7;
}

71
pages/order/index.vue
View File

@@ -58,12 +58,12 @@
<view class="content">
<view></view>
<view class="intro-wrap">
下单日期：{{$u.timeFormat(item.createdAt, 'yyyy-mm-dd hh:MM')}}
下单日期：{{item.createTime}}
</view>
<view class="shop-info">
<view class="shop-item">
<view class="cover" v-for="(item1,index1) in item.goods" :key="index1">
<u-image width="112" height="112" radius="20" :src='item1.productImg'
<u-image width="56" height="56" radius="10" :src='item1.productImg'
v-if="item1.productId!=-999"></u-image>
<u-image width="112" height="112" radius="20"
:src="'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/confirmOrder/table.png'"
@@ -73,47 +73,19 @@
</view>
<view class="shop-amount">
<text class="orderAmount">￥{{item.orderAmount}}</text>
<text class="totalNumber">共{{item.totalNumber}}件</text>
<text class="totalNumber">共{{item.goods.length}}件</text>
</view>
</view>
</view>
<view class="footer-wrap">
<!-- <view class="footer-wrap">
<view class="btn" @click.stop="$u.debounce(isRemoveOrder(item,index),1000)"
v-if="item.status != 'unpaid' && item.status != 'paying'"> 删除订单 </view>
<view class="btn s" @click.stop="$u.debounce(showpopupclick(item),1000)"
v-if="item.status == 'unpaid' || item.status == 'paying'"> 去付款 </view>
</view>
</view> -->
</view>
</view>
<!-- 新订单 -->
<!-- <view class="orderList" v-if="navtabindex == 1">
<view class="listBox" v-for="(item,i) in groupList" :key="i" @click="orderinfoTo(item)">
<view class="df">
<view style="display: flex;">
<text>{{item.proName.length>10?item.proName.substring(0,10)+'...':item.proName}}</text><u-icon
name="arrow-right" color="#000" size="28"></u-icon>
</view>
<text
:class="[item.status=='unpaid'||item.status=='unused'?'state':'state2']">{{item.status|statusFirter}}</text>
</view>
<view class="df" style="justify-content: flex-start;margin-top: 32rpx;">
<image style="width:120rpx; height: 120rpx;border-radius: 12rpx 12rpx 12rpx 12rpx;"
:src="item.proImg" mode="aspectFill">
</image>
<view class="ml-20 fontStyle">
<view>数量：{{item.number}}份</view>
<view>实付：<text style="color: #FF4C11;">￥{{item.payAmount}}</text></view>
</view>
</view>
<button v-if="item.status=='unused'" type="primary" class="buttonStyle">查看券码</button>
<button v-if="item.status=='unpaid'" type="primary" class="buttonStyle">去付款</button>
</view>
</view>
<u-modal width="450rpx" :show="removeOrderShow" @confirm="$u.debounce(removeOrder(),1000)"
@cancel="removeOrderShow = false" @close="removeOrderShow = false" :showCancelButton="true"
:closeOnClickOverlay="true" :title="'是否删除当前订单'"></u-modal>-->
<view v-if="orderForm.list.length <= 0" style="text-align: center;">
<image style="width: 402rpx;height: 442rpx;margin:240rpx auto 32rpx;"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/nomore.png" mode="aspectFill"></image>
@@ -127,13 +99,14 @@
import {
ref,
reactive,
onMounted
onMounted,
} from "vue";
import {
onLoad,
onReady,
onShow,
onPageScroll
onPageScroll,
onReachBottom
} from '@dcloudio/uni-app'
import Nav from '@/components/CustomNavbar.vue'; //导航栏
import {
@@ -152,11 +125,11 @@
},
{
name: '待支付',
status: 'in-production'
status: 'unpaid'
},
{
name: '订单完成',
status: 'refunding'
status: 'done'
},
{
name: '取消订单',
@@ -187,8 +160,7 @@
size: orderForm.form.size,
status: orderForm.status
})
console.log(res)
if (res.totalPage == 1 && res.totalRow <= 10) {
if (res.totalPage == 0 || res.totalPage == 1 && res.totalRow <= 10) {
orderForm.form.status = 'nomore'
orderForm.list = res.records
if (orderForm.form.page == 1 && res.records.length == 0) {
@@ -198,7 +170,11 @@
return false;
} else {
orderForm.form.status = 'loading';
orderForm.list = [...orderForm.list, ...res.records];
if (orderForm.form.page == 1) {
orderForm.list = res.records
} else {
orderForm.list = [...orderForm.list, ...res.records];
}
orderForm.form.page = ++orderForm.form.page;
if (orderForm.form.page > res.totalPage) {
orderForm.form.status = 'nomore';
@@ -221,24 +197,31 @@
orderForm.form.page = 1
orderForm.form.size = 10
orderForm.form.status = 'loadmore'
navtabindex.value == '1' ? getorderList() : userorderList()
// navtabindex.value == '1' ? getorderList() : userorderList()
userorderList()
}
const orderinfo = (e) => {
uni.pro.navigateTo('order/detail', {
orderId: e.id,
shopId:e.shopId
shopId: e.shopId
})
}
onReachBottom(() => {
if (orderForm.form.status != 'nomore') {
console.log('页面滚动到底部');
userorderList()
}
})
onShow(() => {
init_fn()
})
// onMounted(() => {})
</script>
<style scoped lang="scss">
<style lang="scss">
page {
// background: #f6f6f6;
background: #f6f6f6;
}
.navtab {