You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
350 lines
7.6 KiB
350 lines
7.6 KiB
<template>
|
|
<view class="purse">
|
|
<navbar title="立即提现" leftClick @leftClick="$utils.navigateBack"
|
|
bgColor="#DC2828"
|
|
color="#fff"
|
|
/>
|
|
|
|
<!-- 水洗店 -->
|
|
<view class="userShop">
|
|
<userShopCommission purse />
|
|
</view>
|
|
|
|
<view class="from-body">
|
|
<view>我要提现</view>
|
|
<view class="from-line">
|
|
<input
|
|
placeholder="请输入提现积分"
|
|
v-model="withdrawAmount"
|
|
type="digit"
|
|
@input="onAmountInput"
|
|
/>
|
|
</view>
|
|
<view class="tips" v-if="userInfo.money">
|
|
可提现：¥{{userInfo.money}}
|
|
</view>
|
|
|
|
<!-- 快捷积分选择 -->
|
|
<view class="quick-amounts" v-if="userInfo.money && parseFloat(userInfo.money) > 0">
|
|
<view class="quick-label">快捷选择：</view>
|
|
<view class="amount-buttons">
|
|
<view
|
|
class="amount-btn"
|
|
v-for="amount in quickAmounts"
|
|
:key="amount"
|
|
:class="{'disabled': amount > parseFloat(userInfo.money)}"
|
|
@click="selectQuickAmount(amount)"
|
|
>
|
|
¥{{amount}}
|
|
</view>
|
|
<view
|
|
class="amount-btn all"
|
|
@click="selectAllAmount"
|
|
>
|
|
全部
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<!-- <view class="from-line">
|
|
<input placeholder="请输入姓名" />
|
|
</view>
|
|
<view class="from-line">
|
|
<input placeholder="请输入开户行" />
|
|
</view>
|
|
<view class="from-line">
|
|
<input placeholder="请输入银行卡卡号" />
|
|
</view> -->
|
|
<view class="mt56">提现说明</view>
|
|
<view style="line-height: 45rpx; font-size: 24rpx;color: #666666;" v-html="notice">
|
|
</view>
|
|
<!-- <p>1、本次提现必须通过银行卡提现，暂不支持其他途径。</p>
|
|
<p>2、如若遇到24小时提现未到账，请联系客服。</p> -->
|
|
</view>
|
|
|
|
|
|
<view class="b-fiexd">
|
|
<view
|
|
class="button-submit"
|
|
:class="{'disabled': isSubmitting || !withdrawAmount}"
|
|
@click="submitWithdraw"
|
|
>
|
|
{{isSubmitting ? '提交中...' : '提交'}}
|
|
</view>
|
|
</view>
|
|
|
|
<!-- <quick-order-entry
|
|
ref="quickOrderEntry"
|
|
/> -->
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import userShopCommission from '@/components/userShop/userShopCommission.vue'
|
|
export default {
|
|
components: {
|
|
userShopCommission,
|
|
},
|
|
data() {
|
|
return {
|
|
notice: '',
|
|
withdrawAmount: '', // 提现积分
|
|
isSubmitting: false, // 是否正在提交
|
|
quickAmounts: [10, 50, 100, 200, 500], // 快捷积分选项
|
|
}
|
|
},
|
|
computed: {
|
|
userInfo() {
|
|
return this.$store.state.userInfo || {};
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.$store.commit('getUserInfo');
|
|
},
|
|
methods: {
|
|
// 选择快捷积分
|
|
selectQuickAmount(amount) {
|
|
if (amount > parseFloat(this.userInfo.money)) return;
|
|
this.withdrawAmount = amount.toString();
|
|
},
|
|
|
|
// 选择全部积分
|
|
selectAllAmount() {
|
|
if (this.userInfo.money) {
|
|
this.withdrawAmount = parseFloat(this.userInfo.money).toString();
|
|
}
|
|
},
|
|
|
|
// 积分输入处理
|
|
onAmountInput(e) {
|
|
let value = e.detail.value;
|
|
// 只允许输入数字和小数点
|
|
value = value.replace(/[^\d.]/g, '');
|
|
// 只允许一个小数点
|
|
const pointIndex = value.indexOf('.');
|
|
if (pointIndex !== -1) {
|
|
value = value.substring(0, pointIndex + 1) + value.substring(pointIndex + 1).replace(/\./g, '');
|
|
}
|
|
// 最多保留2位小数
|
|
if (pointIndex !== -1 && value.length > pointIndex + 3) {
|
|
value = value.substring(0, pointIndex + 3);
|
|
}
|
|
this.withdrawAmount = value;
|
|
},
|
|
|
|
// 验证提现积分
|
|
validateAmount() {
|
|
if (!this.withdrawAmount) {
|
|
uni.showToast({
|
|
title: '请输入提现积分',
|
|
icon: 'none'
|
|
});
|
|
return false;
|
|
}
|
|
|
|
const amount = parseFloat(this.withdrawAmount);
|
|
if (isNaN(amount) || amount <= 0) {
|
|
uni.showToast({
|
|
title: '请输入正确的提现积分',
|
|
icon: 'none'
|
|
});
|
|
return false;
|
|
}
|
|
|
|
// 检查提现积分是否超过可用余额
|
|
if (this.userInfo.money && amount > parseFloat(this.userInfo.money)) {
|
|
uni.showToast({
|
|
title: '提现积分不能超过可用余额',
|
|
icon: 'none'
|
|
});
|
|
return false;
|
|
}
|
|
|
|
// 检查最小提现积分（假设最小提现1元）
|
|
if (amount < 1) {
|
|
uni.showToast({
|
|
title: '最小提现积分为1元',
|
|
icon: 'none'
|
|
});
|
|
return false;
|
|
}
|
|
|
|
return true;
|
|
},
|
|
|
|
// 提交提现申请
|
|
submitWithdraw() {
|
|
if (this.isSubmitting) return;
|
|
|
|
// 验证提现积分
|
|
if (!this.validateAmount()) return;
|
|
|
|
// 确认提现
|
|
uni.showModal({
|
|
title: '确认提现',
|
|
content: `确定要提现 ¥${this.withdrawAmount} 元吗？`,
|
|
success: (res) => {
|
|
if (res.confirm) {
|
|
this.doWithdraw();
|
|
}
|
|
}
|
|
});
|
|
},
|
|
|
|
// 执行提现操作
|
|
doWithdraw() {
|
|
this.isSubmitting = true;
|
|
|
|
const params = {
|
|
money: parseFloat(this.withdrawAmount)
|
|
};
|
|
|
|
this.$api('openMoney', params, res => {
|
|
this.isSubmitting = false;
|
|
|
|
if (res.code === 200) {
|
|
uni.showToast({
|
|
title: '提现申请提交成功',
|
|
icon: 'success',
|
|
duration: 2000,
|
|
success: () => {
|
|
// 清空输入框
|
|
this.withdrawAmount = '';
|
|
// 刷新用户信息
|
|
this.$store.commit('getUserInfo');
|
|
// 延迟返回上一页或跳转到提现记录页面
|
|
setTimeout(() => {
|
|
uni.navigateBack();
|
|
}, 2000);
|
|
}
|
|
});
|
|
} else {
|
|
uni.showModal({
|
|
title: '提现失败',
|
|
content: res.message || '提现申请提交失败，请重试',
|
|
showCancel: false
|
|
});
|
|
}
|
|
}, err => {
|
|
this.isSubmitting = false;
|
|
console.error('提现请求失败', err);
|
|
uni.showModal({
|
|
title: '网络错误',
|
|
content: '网络连接失败，请检查网络后重试',
|
|
showCancel: false
|
|
});
|
|
});
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped lang="scss">
|
|
.purse{
|
|
min-height: 100vh;
|
|
background-color: #ffffff;
|
|
.from-body {
|
|
padding: 40rpx 20rpx;
|
|
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC, PingFang SC-Bold;
|
|
font-weight: 700;
|
|
text-align: left;
|
|
color: #333333;
|
|
line-height: 40px;
|
|
padding-bottom: 160rpx;
|
|
|
|
.from-line {
|
|
margin-top: 40rpx;
|
|
}
|
|
|
|
input {
|
|
width: 612rpx;
|
|
height: 90rpx;
|
|
line-height: 90rpx;
|
|
background: #F5F5F5;
|
|
border-radius: 46rpx;
|
|
|
|
padding: 0 50rpx;
|
|
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC, PingFang SC-Regular;
|
|
font-weight: 400;
|
|
text-align: left;
|
|
color: #333;
|
|
}
|
|
|
|
.tips {
|
|
margin-top: 20rpx;
|
|
font-size: 24rpx;
|
|
color: #999;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.quick-amounts {
|
|
margin-top: 30rpx;
|
|
|
|
.quick-label {
|
|
font-size: 26rpx;
|
|
color: #666;
|
|
margin-bottom: 20rpx;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.amount-buttons {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 20rpx;
|
|
|
|
.amount-btn {
|
|
padding: 16rpx 32rpx;
|
|
background: #f5f5f5;
|
|
border-radius: 30rpx;
|
|
font-size: 26rpx;
|
|
color: #333;
|
|
text-align: center;
|
|
border: 1rpx solid transparent;
|
|
transition: all 0.3s;
|
|
|
|
&:active {
|
|
transform: scale(0.95);
|
|
}
|
|
|
|
&.disabled {
|
|
opacity: 0.5;
|
|
color: #999;
|
|
}
|
|
|
|
&.all {
|
|
background: $uni-color;
|
|
color: #fff;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
.button-submit {
|
|
width: 596rpx;
|
|
height: 90rpx;
|
|
line-height: 90rpx;
|
|
background: $uni-color;
|
|
border-radius: 46rpx;
|
|
|
|
margin: 20rpx auto;
|
|
|
|
font-size: 28rpx;
|
|
font-family: PingFang SC, PingFang SC-Regular;
|
|
font-weight: 400;
|
|
text-align: center;
|
|
color: #ffffff;
|
|
transition: opacity 0.3s;
|
|
|
|
&.disabled {
|
|
opacity: 0.6;
|
|
background: #ccc;
|
|
}
|
|
}
|
|
}
|
|
|
|
</style>
|