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

View File

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

View File

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

View File

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