支付金额为0时的处理修改

This commit is contained in:
2025-10-21 13:26:09 +08:00
parent 5f3a307fec
commit f5a2679913
4 changed files with 630 additions and 551 deletions

View File

@@ -1,189 +1,213 @@
<template>
<view>
<view class="box" v-if="isShow">
<view class="u-flex u-col-center" style="align-items: center;">
<image src="/static/icon/charge.png" class="charge" mode=""></image>
<view class="u-m-l-28 color-333 font-700"> 充值享优惠</view>
</view>
<scroll-view scroll-x="true" class="u-m-t-20">
<view class="list">
<view class="item color1" @click="itemClick(index)" v-for="(item,index) in list" :key="index"
:class="{active:sel==index}">
<view class="">
<text></text>
<text class="font-700" style="font-size: 48rpx;"
:class="{color2:sel==index}">{{item.amount}}</text>
</view>
<view class="font-12" v-if="item.rewardAmount" :class="{color2:sel==index}">
<text></text>
<text></text>
<text class="font-14">{{item.rewardAmount}}</text>
</view>
<view class="font-12" v-if="item.rewardPoints">
<text></text>
<text class="font-14">{{item.rewardPoints}}</text>
<text>积分</text>
</view>
<view class="font-12 color-666" v-if="item.couponInfoList.length">
<text></text>
<text>{{couponNum(item.couponInfoList)}}</text>
<text>张券</text>
<text class="color2 u-m-l-8" v-if="sel==index" @click="lookCoupon(item)">查看</text>
</view>
<view class="sel u-flex" v-if="sel==index">
<image class="image" src="/static/vip/sel.png" mode=""></image>
</view>
</view>
</view>
</scroll-view>
</view>
<view class="" v-else></view>
<CouponList v-model="couponModel.show" :list="couponModel.couponInfoList"></CouponList>
</view>
<view>
<view class="box" v-if="isShow">
<view class="u-flex u-col-center" style="align-items: center">
<image src="/static/icon/charge.png" class="charge" mode=""></image>
<view class="u-m-l-28 color-333 font-700"> 充值享优惠</view>
</view>
<scroll-view scroll-x="true" class="u-m-t-20">
<view class="list">
<view
class="item color1"
@click="itemClick(index)"
v-for="(item, index) in list"
:key="index"
:class="{ active: sel == index }"
>
<view class="">
<text></text>
<text
class="font-700"
style="font-size: 48rpx"
:class="{ color2: sel == index }"
>{{ item.amount }}</text
>
</view>
<view
class="font-12"
v-if="item.rewardAmount"
:class="{ color2: sel == index }"
>
<text></text>
<text></text>
<text class="font-14">{{ item.rewardAmount }}</text>
</view>
<view class="font-12" v-if="item.rewardPoints">
<text></text>
<text class="font-14">{{ item.rewardPoints }}</text>
<text>积分</text>
</view>
<view class="font-12 color-666" v-if="item.couponInfoList.length">
<text></text>
<text>{{ couponNum(item.couponInfoList) }}</text>
<text>张券</text>
<text
class="color2 u-m-l-8"
v-if="sel == index"
@click="lookCoupon(item)"
>查看</text
>
</view>
<view class="sel u-flex" v-if="sel == index">
<image class="image" src="/static/vip/sel.png" mode=""></image>
</view>
</view>
</view>
</scroll-view>
</view>
<view class="" v-else></view>
<CouponList
v-model="couponModel.show"
:list="couponModel.couponInfoList"
></CouponList>
</view>
</template>
<script setup>
import CouponList from '@/components/coupon/list.vue'
import * as rechargeApi from '@/common/api/market/recharge.js'
import {
useCartsStore
} from '@/stores/carts.js';
import {
onMounted,reactive,
ref,
watch
} from 'vue';
const couponModel = reactive({
show: false,
couponInfoList: []
})
function lookCoupon(item) {
couponModel.couponInfoList = item.couponInfoList
couponModel.show = true
}
function couponNum(list) {
return list.reduce((prve, cur) => {
return prve + cur.num
}, 0)
}
const cartStore = useCartsStore()
import CouponList from "@/components/coupon/list.vue";
import * as rechargeApi from "@/common/api/market/recharge.js";
import { useCartsStore } from "@/stores/carts.js";
import { onMounted, reactive, ref, watch } from "vue";
const couponModel = reactive({
show: false,
couponInfoList: [],
});
const list = ref([])
const sel = ref(-1)
const isShow = ref(false)
let data={}
let $riginList=[]
async function init() {
console.log('recharge', )
const shopId = uni.cache.get('shopId')
const res = await rechargeApi.config({
shopId
})
if (res) {
data=res;
$riginList=res.rechargeDetailList
isShow.value = res.isOrder
list.value = res.rechargeDetailList.filter(v=>v.amount>cartStore.orderCostSummary.finalPayAmount)
if(list.value.length){
updateSel()
}
}
}
watch(()=>cartStore.orderCostSummary.finalPayAmount,(newval)=>{
list.value=$riginList.filter(v=>v.amount>newval)
if(list.value.length){
updateSel()
}
})
const emits=defineEmits(['updateChargeSel','updateRechargeId'])
function updateSel(){
const selItem=list.value[sel.value]
emits('updateChargeSel',selItem?selItem:{})
emits('updateRechargeId',data.id)
}
function itemClick(index){
console.log('itemClick',sel.value,index);
if(sel.value==-1){
sel.value=index
return
}
if(sel.value==index){
sel.value=-1
return
}
sel.value=index
}
watch(()=>sel.value,(newval)=>{
updateSel()
})
onMounted(() => {
init()
})
function lookCoupon(item) {
couponModel.couponInfoList = item.couponInfoList;
couponModel.show = true;
}
function couponNum(list) {
return list.reduce((prve, cur) => {
return prve + cur.num;
}, 0);
}
const cartStore = useCartsStore();
const list = ref([]);
const sel = ref(-1);
const isShow = ref(false);
let data = {};
let $riginList = [];
const emits = defineEmits(["updateChargeSel", "updateRechargeId","updateIsShow"]);
async function init() {
console.log("recharge");
const shopId = uni.cache.get("shopId");
const res = await rechargeApi.config({
shopId,
});
if (res) {
data = res;
$riginList = res.rechargeDetailList;
isShow.value = res.isOrder&&res.isEnable?true:false;
list.value = res.rechargeDetailList.filter(
(v) => v.amount > cartStore.orderCostSummary.finalPayAmount
);
if (list.value.length) {
updateSel();
}
}
}
watch(
() => cartStore.orderCostSummary.finalPayAmount,
(newval) => {
list.value = $riginList.filter((v) => v.amount > newval);
if (list.value.length) {
updateSel();
}
}
);
function updateSel() {
const selItem = list.value[sel.value];
emits("updateChargeSel", selItem ? selItem : {});
emits("updateRechargeId", data.id);
}
function itemClick(index) {
console.log("itemClick", sel.value, index);
if (sel.value == -1) {
sel.value = index;
return;
}
if (sel.value == index) {
sel.value = -1;
return;
}
sel.value = index;
}
watch(
() => sel.value,
(newval) => {
updateSel();
}
);
watch(()=>isShow.value,(newval)=>{
emits("updateIsShow", newval);
})
onMounted(() => {
init();
});
</script>
<style lang="scss" scoped>
.color1{
color: #5F2E0F;
}
.color2{
color: #FF6300;
}
.box {
background-color: #fdf9f6;
padding: 30rpx;
margin-top: 32rpx;
border-radius: 22rpx;
overflow: hidden;
}
.color1 {
color: #5f2e0f;
}
.color2 {
color: #ff6300;
}
.box {
background-color: #fdf9f6;
padding: 30rpx;
margin-top: 32rpx;
border-radius: 22rpx;
overflow: hidden;
}
.charge {
width: 70rpx;
height: 70rpx;
}
.charge {
width: 70rpx;
height: 70rpx;
}
.list {
display: flex;
gap: 20rpx;
padding: 20rpx 0;
.list {
display: flex;
gap: 20rpx;
padding: 20rpx 0;
.item {
padding: 36rpx 22rpx;
border-radius: 42rpx;
background: linear-gradient(180deg, #F5F5F5 58.54%, #FFF 104.47%);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
box-sizing: border-box;
border: 6rpx solid transparent;
transition: all .3s ease-in-out;
min-width: 202rpx;
.item {
padding: 36rpx 22rpx;
border-radius: 42rpx;
background: linear-gradient(180deg, #f5f5f5 58.54%, #fff 104.47%);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
box-sizing: border-box;
border: 6rpx solid transparent;
transition: all 0.3s ease-in-out;
min-width: 202rpx;
&.active {
background: linear-gradient(180deg, #FFC29A -26.17%, #FFF 64.06%);
border: 6rpx solid #FE6C0E;
box-shadow: 0 0 31rpx 2rpx #fe8b435e;
}
&.active {
background: linear-gradient(180deg, #ffc29a -26.17%, #fff 64.06%);
border: 6rpx solid #fe6c0e;
box-shadow: 0 0 31rpx 2rpx #fe8b435e;
}
.sel {
position: absolute;
bottom: 0;
left: 50%;
.sel {
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%) translateY(21rpx);
transform: translateX(-50%) translateY(21rpx);
.image {
width: 42rpx;
height: 42rpx;
}
}
}
}
.image {
width: 42rpx;
height: 42rpx;
}
}
}
}
</style>

View File

@@ -115,6 +115,7 @@
<ChargeVue
@updateChargeSel="(e) => updateChargeSel(e)"
@updateRechargeId="updateRechargeId"
@updateIsShow="updateIsShow"
v-if="listinfo.status == 'unpaid' || !listinfo.id"
></ChargeVue>
</view>
@@ -275,7 +276,12 @@ const customStyle = {
const cartStore = useCartsStore();
//充值相关
//充值相关start
//充值和余额支付是否可用
const isCanUseCharge = ref(false);
function updateIsShow(e){
isCanUseCharge.value = e;
}
const rechargeItem = ref({
id: "",
});
@@ -289,6 +295,7 @@ function updateChargeSel(newval) {
rechargeItem.value = newval;
console.log("updateChargeSel", newval);
}
//充值相关end
async function onMessage(Message) {
cartStore.onMessage(Message, cartsSocket);
@@ -435,14 +442,15 @@ const orderorderInfo = async () => {
orderId: listinfo.id,
})
: await APIhistoryOrder({
tableCode: options.tableCode,
tableCode: options.tableCode||"",
});
orderRemarker.value = res.remark;
Object.assign(listinfo, res);
if (res && res.tableCode) {
socketInitPar.table_code = res.tableCode;
let tableRes = await getTableInfo({
tableCode: options.tableCode,
tableCode: options.tableCode||"",
});
console.log(tableRes);
listinfo.tableName = tableRes.name;
@@ -450,7 +458,7 @@ const orderorderInfo = async () => {
if (options.tableCode) {
socketInitPar.table_code = options.tableCode;
let tableRes = await getTableInfo({
tableCode: options.tableCode,
tableCode: options.tableCode||"",
});
console.log(tableRes);
listinfo.tableName = tableRes.name;
@@ -626,7 +634,7 @@ const createOrder = async () => {
placeNum: listinfo.id ? listinfo.placeNum * 1 + 1 : 1, //当前订单下单次数
waitCall: "", //是否等叫 0 否 1 等叫
orderId: listinfo.id || "",
tableCode: options.tableCode,
tableCode: options.tableCode||'',
userId: uni.cache.get("userInfo").id || "", //
});
// 清空购物车
@@ -1055,7 +1063,7 @@ async function init(opt) {
if (res) {
uni.cache.set("tableCode", res.tableCode);
uni.cache.set("tableCode", res.seatNum);
options.tableCode = res.tableCode;
options.tableCode = res.tableCode||'';
cartStore.setSeatFeeConfig("personCount", res.seatNum);
cartStore.setDinnerType(res.dineMode || "dine-in");
orderRemarker.value = res.remark;
@@ -1151,8 +1159,11 @@ const disablePayType = computed(() => {
) {
arr.add("余额支付");
}
if (cartStore.orderCostSummary.orderOriginFinalPayAmount <= 0) {
arr.add("微信支付");
// if (cartStore.orderCostSummary.orderOriginFinalPayAmount <= 0) {
// arr.add("微信支付");
// }
if(!isCanUseCharge.value){
arr.add("余额支付");
}
return Array.from(arr);

View File

@@ -1,411 +1,451 @@
<!-- 充值中心 -->
<template>
<view class="container">
<up-navbar bgColor="transparent" title="充值中心" @leftClick="back"></up-navbar>
<view class="header-wrap">
<image class="bg" src="/static/czzx_header_bg.png" mode="aspectFill"></image>
<view class="select-shop">
<view class="select-btn">
<up-icon name="map" color="#333"></up-icon>
<text class="t">{{shopInfo.shopName}}</text>
<up-icon name="arrow-right" color="#333"></up-icon>
</view>
</view>
<view class="balance-wrap">
<view class="left">
<text class="i t">余额</text>
<text class="n t">{{shopUserInfo.amount||0}}</text>
</view>
<view class="right">
<text class="t" @click="toDetail">明细</text>
<text class="t" @click="toPwd">密码设置</text>
</view>
</view>
<view class="btm-wrap">
<view class="">
<view class="container">
<up-navbar
bgColor="transparent"
title="充值中心"
@leftClick="back"
></up-navbar>
<view class="header-wrap">
<image
class="bg"
src="/static/czzx_header_bg.png"
mode="aspectFill"
></image>
<view class="select-shop">
<view class="select-btn">
<up-icon name="map" color="#333"></up-icon>
<text class="t">{{ shopInfo.shopName }}</text>
<up-icon name="arrow-right" color="#333"></up-icon>
</view>
</view>
<view class="balance-wrap">
<view class="left">
<text class="i t">余额</text>
<text class="n t">{{ shopUserInfo.amount || 0 }}</text>
</view>
<view class="right">
<text class="t" @click="toDetail">明细</text>
<text class="t" @click="toPwd">密码设置</text>
</view>
</view>
<view class="btm-wrap">
<view class=""> </view>
</view>
</view>
<view class="bottom">
<view class="u-flex u-flex-between">
<view class="u-flex">
<image
src="/static/vip/money.png"
style="width: 44rpx; height: 44rpx"
mode=""
></image>
<text class="u-m-l-24 color-333 font-16 font-700">立即充值</text>
</view>
<view class="font-12 color-999">
<text>充值代表接受</text>
<text style="color: #ecb592">用户隐私协议</text>
</view>
</view>
<view class="list u-m-t-40">
<view
class="item color1"
@click="sel = index"
v-for="(item, index) in list"
:key="index"
:class="{ active: sel == index }"
>
<view class="">
<text></text>
<text
class="font-700"
style="font-size: 48 u-flex-1rpx"
:class="{ color2: sel == index }"
>{{ item.amount }}</text
>
</view>
<view
class="font-12"
v-if="item.rewardAmount"
:class="{ color2: sel == index }"
>
<text></text>
<text></text>
<text class="font-14">{{ item.rewardAmount }}</text>
</view>
<view class="font-12" v-if="item.rewardPoints" style="color: #5f2e0f">
<text></text>
<text class="font-14">{{ item.rewardPoints }}</text>
<text class="">积分</text>
</view>
<view class="font-12 color-666" v-if="item.couponInfoList.length">
<text></text>
<text>{{ couponNum(item.couponInfoList) }}</text>
<text>张券</text>
<text
class="color2 u-m-l-8"
v-if="sel == index"
@click="lookCoupon(item)"
>查看</text
>
</view>
</view>
</view>
</view>
<view class="bottom">
<view class="u-flex u-flex-between">
<view class="u-flex ">
<image src="/static/vip/money.png" style="width: 44rpx;height: 44rpx;" mode=""></image>
<text class="u-m-l-24 color-333 font-16 font-700">立即充值</text>
</view>
<view class="font-12 color-999">
<text>充值代表接受</text>
<text style="color: #ECB592;">用户隐私协议</text>
</view>
</view>
<view class="list u-m-t-40">
<view class="item color1" @click="sel=index" v-for="(item,index) in list" :key="index"
:class="{active:sel==index}">
<view class="">
<text></text>
<text class="font-700" style="font-size: 48 u-flex-1rpx;"
:class="{color2:sel==index}">{{item.amount}}</text>
</view>
<view class="font-12" v-if="item.rewardAmount" :class="{color2:sel==index}">
<text></text>
<text></text>
<text class="font-14">{{item.rewardAmount}}</text>
</view>
<view class="font-12" v-if="item.rewardPoints" style="color: #5F2E0F;">
<text></text>
<text class="font-14">{{item.rewardPoints}}</text>
<text class="">积分</text>
</view>
<view class="font-12 color-666" v-if="item.couponInfoList.length">
<text></text>
<text>{{couponNum(item.couponInfoList) }}</text>
<text>张券</text>
<text class="color2 u-m-l-8" v-if="sel==index" @click="lookCoupon(item)">查看</text>
</view>
<view class="sel u-flex" v-if="sel == index">
<image class="image" src="/static/vip/sel.png" mode=""></image>
</view>
</view>
</view>
<template v-if="state.isCustom">
<view class="u-flex other flex-center">
<text class="font-14 color-333 font-700 u-m-r-28">其他金额</text>
<up-input
v-model="money"
type="number"
placeholder="请输入充值金额"
border="none"
placeholder-style="font-size:14px;"
></up-input>
</view>
<view class="color-999 font-12 u-m-t-4"
>自定义金额充值时不享受任何优惠赠送</view
>
</template>
<view class="sel u-flex" v-if="sel==index">
<image class="image" src="/static/vip/sel.png" mode=""></image>
</view>
</view>
</view>
<template v-if="state.isCustom">
<view class="u-flex other flex-center">
<text class="font-14 color-333 font-700 u-m-r-28">其他金额</text>
<up-input v-model="money" type="number" placeholder="请输入充值金额" border="none"
placeholder-style="font-size:14px;"></up-input>
</view>
<view class="color-999 font-12 u-m-t-4">自定义金额充值时不享受任何优惠赠送</view>
</template>
<button class="buy-btn" @click="buy">
<text class="font-16 ">{{charge_money}}</text>
<text class="font-14 u-m-l-24">立即充值</text>
</button>
<view class="u-m-t-36 color-999 font-12">
<view>充值说明</view>
<view class="u-m-t-16">
<text>适用门店</text>
<text class="color2 u-m-l-28" @click="toShopList">全国门店通用 {{'>'}} </text>
</view>
<view class="u-m-t-16">
<text>有效期限</text>
<text class=" u-m-l-28">永久有效 </text>
</view>
<view class="u-m-t-16 u-flex u-flex-y-center">
<text class="no-wrap">注意事项</text>
<view class="u-m-l-28">
<view>1.储值完成后不支持自助退款,可联系商家处理</view>
<view> 2.余额不支持转赠,不可提现,长期有效</view>
</view>
</view>
<view class="u-m-t-16 u-flex u-flex-y-center">
<text class="no-wrap">充值说明</text>
<text class="u-m-l-28" style="word-break: break-all;">
{{state.remark||''}}
</text>
</view>
</view>
</view>
<CouponList v-model="couponModel.show" :list="couponModel.couponInfoList"></CouponList>
</view>
<button
class="buy-btn"
@click="buy"
:class="{ disabled: !state.isEnable }"
>
<text class="font-16">{{ charge_money }}</text>
<text class="font-14 u-m-l-24">立即充值</text>
</button>
<view class="u-m-t-36 color-999 font-12">
<view>充值说明</view>
<view class="u-m-t-16">
<text>适用门店</text>
<text class="color2 u-m-l-28" @click="toShopList"
>全国门店通用 {{ ">" }}
</text>
</view>
<view class="u-m-t-16">
<text>有效期限</text>
<text class="u-m-l-28">永久有效 </text>
</view>
<view class="u-m-t-16 u-flex u-flex-y-center">
<text class="no-wrap">注意事项</text>
<view class="u-m-l-28">
<view>1.储值完成后不支持自助退款可联系商家处理</view>
<view> 2.余额不支持转赠不可提现长期有效</view>
</view>
</view>
<view class="u-m-t-16 u-flex u-flex-y-center">
<text class="no-wrap">充值说明</text>
<text class="u-m-l-28" style="word-break: break-all">
{{ state.remark || "" }}
</text>
</view>
</view>
</view>
<CouponList
v-model="couponModel.show"
:list="couponModel.couponInfoList"
></CouponList>
</view>
</template>
<script setup>
import {
APIusershopInfodetail,
APIshopUserInfo
} from '@/common/api/member.js'
import CouponList from '@/components/coupon/list.vue'
import * as rechargeApi from '@/common/api/market/recharge.js'
import {
recharge
} from '@/common/api/order/index.js'
import {
joinMember
} from '@/common/api/order/index.js'
import {
ref,
onMounted,
computed,
reactive,
watch
} from 'vue'
import {
onLoad
} from '@dcloudio/uni-app'
import {
pay
} from '@/utils/pay.js'
function toShopList(){
uni.navigateTo({
url:'/pages/user/member/czzx-shop-list?shopId='+option.shopId
})
}
import { APIusershopInfodetail, APIshopUserInfo } from "@/common/api/member.js";
import CouponList from "@/components/coupon/list.vue";
import * as rechargeApi from "@/common/api/market/recharge.js";
import { recharge } from "@/common/api/order/index.js";
import { joinMember } from "@/common/api/order/index.js";
import { ref, onMounted, computed, reactive, watch } from "vue";
import { onLoad } from "@dcloudio/uni-app";
import { pay } from "@/utils/pay.js";
function couponNum(list) {
return list.reduce((prve, cur) => {
return prve + cur.num
}, 0)
}
const couponModel = reactive({
show: false,
couponInfoList: []
})
function toShopList() {
uni.navigateTo({
url: "/pages/user/member/czzx-shop-list?shopId=" + option.shopId,
});
}
function lookCoupon(item) {
couponModel.show = true
couponModel.couponInfoList = item.couponInfoList
}
async function buy() {
if (!charge_money.value) {
return uni.showToast({
title: '请选择或者输入充值金额',
icon: 'none'
})
}
const json = {
shopId: option.shopId,
shopUserId: shopUserInfo.id,
}
if (sel.value < 0) {
json.amount = `${money.value}`.trim() * 1
} else {
json.rechargeDetailId = list.value[sel.value].id
json.amount = list.value[sel.value].amount
}
const res = await recharge(json)
if (!res) {
return uni.showToast({
title: '充值失败',
icon: 'error'
})
}
const payRes = await pay(res)
console.log(payRes);
if (payRes) {
uni.showToast({
title: '充值成功',
icon: 'none'
})
init()
}
function couponNum(list) {
return list.reduce((prve, cur) => {
return prve + cur.num;
}, 0);
}
const couponModel = reactive({
show: false,
couponInfoList: [],
});
}
function lookCoupon(item) {
couponModel.show = true;
couponModel.couponInfoList = item.couponInfoList;
}
async function buy() {
if (!state.isEnable) {
return uni.showToast({
title: "充值未开启,暂不能充值",
icon: "none",
});
}
if (!charge_money.value) {
return uni.showToast({
title: "请选择或者输入充值金额",
icon: "none",
});
}
const json = {
shopId: option.shopId,
shopUserId: shopUserInfo.id,
};
if (sel.value < 0) {
json.amount = `${money.value}`.trim() * 1;
} else {
json.rechargeDetailId = list.value[sel.value].id;
json.amount = list.value[sel.value].amount;
}
const res = await recharge(json);
if (!res) {
return uni.showToast({
title: "充值失败",
icon: "error",
});
}
const payRes = await pay(res);
console.log(payRes);
if (payRes) {
uni.showToast({
title: "充值成功",
icon: "none",
});
init();
}
}
function toDetail() {
uni.navigateTo({
url: '/pages/user/member/billDetails?type=1&shopId=' + option.shopId
})
}
function toDetail() {
uni.navigateTo({
url: "/pages/user/member/billDetails?type=1&shopId=" + option.shopId,
});
}
function toPwd() {
uni.navigateTo({
url: '/pages/user/member/setPassword?type=1&shopId=' + option.shopId
})
}
function toPwd() {
uni.navigateTo({
url: "/pages/user/member/setPassword?type=1&shopId=" + option.shopId,
});
}
function back() {
uni.navigateBack();
}
const list = ref([])
const sel = ref(0)
const money = ref(null);
const option = reactive({
shopId: ''
})
const shopInfo = reactive({})
const shopUserInfo = reactive({})
const state = reactive({})
async function init() {
const shopInfoRes = await APIusershopInfodetail({
shopId: option.shopId
})
if (shopInfoRes) {
Object.assign(shopInfo, shopInfoRes.shopInfo)
}
const shopUserInfoRes = await APIshopUserInfo({
shopId: option.shopId
})
if (shopUserInfoRes) {
Object.assign(shopUserInfo, shopUserInfoRes)
}
const res = await rechargeApi.config({
shopId: option.shopId
})
if (res) {
Object.assign(state, res)
list.value = res.rechargeDetailList
}
}
const charge_money = computed(() => {
if (sel.value < 0) {
if (money.value > 0) {
return money.value
}
return ''
}
const item = list.value[sel.value]
if (item) {
return item.amount
}
return ''
})
onLoad((opt) => {
Object.assign(option, opt)
init()
})
function back() {
uni.navigateBack();
}
const list = ref([]);
const sel = ref(0);
const money = ref(null);
const option = reactive({
shopId: "",
});
const shopInfo = reactive({});
const shopUserInfo = reactive({});
const state = reactive({});
async function init() {
const shopInfoRes = await APIusershopInfodetail({
shopId: option.shopId,
});
if (shopInfoRes) {
Object.assign(shopInfo, shopInfoRes.shopInfo);
}
const shopUserInfoRes = await APIshopUserInfo({
shopId: option.shopId,
});
if (shopUserInfoRes) {
Object.assign(shopUserInfo, shopUserInfoRes);
}
const res = await rechargeApi.config({
shopId: option.shopId,
});
if (res) {
Object.assign(state, res);
list.value = res.rechargeDetailList;
}
}
const charge_money = computed(() => {
if (sel.value < 0) {
if (money.value > 0) {
return money.value;
}
return "";
}
const item = list.value[sel.value];
if (item) {
return item.amount;
}
return "";
});
onLoad((opt) => {
Object.assign(option, opt);
init();
});
watch(() => money.value, (newval) => {
if (newval && newval > 0) {
sel.value = -1
}
})
watch(
() => money.value,
(newval) => {
if (newval && newval > 0) {
sel.value = -1;
}
}
);
</script>
<style scoped lang="scss">
.color1 {
color: #5F2E0F;
}
.color1 {
color: #5f2e0f;
}
.color2 {
color: #FF6300;
}
.color2 {
color: #ff6300;
}
.buy-btn {
margin-top: 28rpx;
padding: 32rpx 32rpx;
color: #fff;
font-size: 16px;
font-weight: 700;
border-radius: 80rpx;
line-height: 1;
background: linear-gradient(98deg, #fe6d1100 40.64%, #FFD1B4 105.2%), linear-gradient(259deg, #FE6D11 50.14%, #FFD1B4 114.93%);
box-shadow: 0 14rpx 30.4rpx 0 #fe8b435e;
}
.buy-btn {
margin-top: 28rpx;
padding: 32rpx 32rpx;
color: #fff;
font-size: 16px;
font-weight: 700;
border-radius: 80rpx;
line-height: 1;
background: linear-gradient(98deg, #fe6d1100 40.64%, #ffd1b4 105.2%),
linear-gradient(259deg, #fe6d11 50.14%, #ffd1b4 114.93%);
box-shadow: 0 14rpx 30.4rpx 0 #fe8b435e;
&.disabled {
background: #eee;
box-shadow: none;
border: none;
color: #999;
}
}
.other {
background: #F6F6F6;
padding: 24rpx 16rpx;
margin-top: 40rpx;
}
.other {
background: #f6f6f6;
padding: 24rpx 16rpx;
margin-top: 40rpx;
}
.header-wrap {
width: 100%;
height: 530rpx;
box-sizing: border-box;
padding: calc(var(--status-bar-height) + 140rpx) 28rpx 28rpx;
position: relative;
.header-wrap {
width: 100%;
height: 530rpx;
box-sizing: border-box;
padding: calc(var(--status-bar-height) + 140rpx) 28rpx 28rpx;
position: relative;
.bg {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.bg {
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.select-shop {
display: flex;
align-items: center;
position: relative;
.select-shop {
display: flex;
align-items: center;
position: relative;
.select-btn {
display: flex;
align-items: center;
gap: 12upx;
.select-btn {
display: flex;
align-items: center;
gap: 12upx;
.t {
color: #333;
}
}
}
.t {
color: #333;
}
}
}
.balance-wrap {
display: flex;
justify-content: space-between;
position: relative;
padding-top: 40upx;
.balance-wrap {
display: flex;
justify-content: space-between;
position: relative;
padding-top: 40upx;
.left {
display: flex;
align-items: center;
.left {
display: flex;
align-items: center;
.t {
color: #5e3110;
.t {
color: #5e3110;
&.i {
position: relative;
top: 10upx;
font-size: 28upx;
}
&.i {
position: relative;
top: 10upx;
font-size: 28upx;
}
&.n {
font-size: 64upx;
font-weight: bold;
}
}
}
&.n {
font-size: 64upx;
font-weight: bold;
}
}
}
.right {
display: flex;
flex-direction: column;
gap: 12upx;
.right {
display: flex;
flex-direction: column;
gap: 12upx;
.t {
color: #86491d;
font-size: 28upx;
}
}
}
}
.t {
color: #86491d;
font-size: 28upx;
}
}
}
}
.bottom {
background-color: rgba(255, 255, 255, .3);
padding: 40rpx 28rpx 0 28rpx;
transform: translateY(-140rpx);
border-radius: 74rpx 74rpx 0 0;
}
.bottom {
background-color: rgba(255, 255, 255, 0.3);
padding: 40rpx 28rpx 0 28rpx;
transform: translateY(-140rpx);
border-radius: 74rpx 74rpx 0 0;
}
.list {
display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: 20rpx;
row-gap: 22rpx;
.list {
display: grid;
grid-template-columns: repeat(3, 1fr);
column-gap: 20rpx;
row-gap: 22rpx;
.item {
padding: 36rpx 22rpx;
border-radius: 42rpx;
background: linear-gradient(180deg, #F5F5F5 58.54%, #FFF 140.47%);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
box-sizing: border-box;
border: 6rpx solid transparent;
transition: all .3s ease-in-out;
.item {
padding: 36rpx 22rpx;
border-radius: 42rpx;
background: linear-gradient(180deg, #f5f5f5 58.54%, #fff 140.47%);
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
position: relative;
box-sizing: border-box;
border: 6rpx solid transparent;
transition: all 0.3s ease-in-out;
&.active {
background: linear-gradient(180deg, #FFC29A -26.17%, #FFF 64.06%);
border: 6rpx solid #FE6C0E;
box-shadow: 0 0 31rpx 2rpx #fe8b435e;
}
&.active {
background: linear-gradient(180deg, #ffc29a -26.17%, #fff 64.06%);
border: 6rpx solid #fe6c0e;
box-shadow: 0 0 31rpx 2rpx #fe8b435e;
}
.sel {
position: absolute;
bottom: 0;
left: 50%;
.sel {
position: absolute;
bottom: 0;
left: 50%;
transform: translateX(-50%) translateY(21rpx);
transform: translateX(-50%) translateY(21rpx);
.image {
width: 42rpx;
height: 42rpx;
}
}
}
}
.image {
width: 42rpx;
height: 42rpx;
}
}
}
}
</style>

View File

@@ -125,6 +125,10 @@ export const Memberpay = defineStore('memberpay', {
userId: uni.cache.get('userInfo').id || ''
})
console.log('actionsltPayOrder:res',res);
if(typeof res ==='string'){
resolve(res)
return
}
if(!res){
console.log('支付失败');
reject(false)