<template> <dmDialog ref='popView' :isShowTitle="true" title="提现" :isShowClose="true" :isShowConfirm="false" marginSize="60rpx"> <view class="content"> <view class="report_title"> <text class="report_title_">提现到:</text> <image class="icon_weichart" src="../../static/icons/icon_weichat.png" mode=""></image> <text class="report_title_money">微信零钱</text> </view> <view class="withDrawal_content"> <view class="report_title_"> 提现金额 </view> <view class="report_title_desc"> (可提现金额¥{{canCashOut||'0.00'}}) </view> </view> <view class="input_money"> <text class="money_bz">¥</text> <input class="money" type="digit" v-model="money" @input="onKeyInput" :maxlength="moneyMaxLeng"/> <image class="icon_close" v-if="money" src="../../static/icons/icon_close_full.png" mode="" @click="clearMoney"></image> </view> <view class="line"> </view> <text class="notice_red" v-if="Number(money)>Number(canCashOut)">输入金额超过可提现金额</text> <text class="notice" v-else>单笔限额200元</text> <view class="btn"> <view class="btn_cancel" @click="cancel"> 取消 </view> <view class="btn_confirm" @click="confirmWithDrawal"> 确认提现 </view> </view> </view> </dmDialog> </template> <script> import dmDialog from "./dmDialog.vue" export default{ props:{ canCashOut:[String,Number], }, data(){ return { moneyMaxLeng:11, money:"" } }, methods:{ show() { this.$refs.popView.show() }, knowAction(){ this.money = "" this.$refs.popView.hide() }, onKeyInput(e){ let val = e.target.value; val = val.replace(/[^\d.]/g, ""); //清除"数字"和"."以外的字符 val = val.replace(/\.{2,}/g, "."); //只保留第一个. 清除多余的 val = val.replace(/^0+\./g, '0.'); val = val.match(/^0+[1-9]+/) ? val = val.replace(/^0+/g, '') : val val = (val.match(/^\d*(\.?\d{0,2})/g)[0]) || '' if (val.includes(".")) { let numDian = val.toString().split(".")[1].length; if (numDian === 2) { this.moneyMaxLeng = val.length; } } else { this.moneyMaxLeng = 8; } this.money = val }, clearMoney(){ this.money = "" }, cancel(){ this.money = "" this.$refs.popView.hide() }, async confirmWithDrawal(){ if(!this.money||this.money==0){ uni.showToast({ icon:"none", title:"请输入提现金额" }) return } let param = { "amount": this.money } const res = await this.$myRequest({ url: '/cash/apply', data:param, }); if (res && res.data.success) { uni.showToast({ icon:"none", title:"提现成功" }) }else{ uni.showToast({ icon:"none", title:res.data.message }) } } }, mounted() { }, components:{ dmDialog } } </script> <style scoped lang="scss"> .content{ width: 100%; height: 490rpx; padding-left: 40rpx; padding-right: 40rpx; box-sizing: border-box; } .report_title{ display: flex; align-items: center; margin-top: 52rpx; margin-bottom: 40rpx; .report_title_{ font-size: 28rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #262626; } .icon_weichart { width: 34rpx; height: 28rpx; margin-right: 8rpx; } .report_title_money{ font-size: 28rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #262626; } } .withDrawal_content{ display: flex; align-items: center; .report_title_{ font-size: 28rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #262626; } .report_title_desc{ font-size: 28rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #b1b1b1; } } .input_money{ margin-top: 12rpx; margin-bottom: 19rpx; display: flex; align-items: center; .money_bz{ font-size: 52rpx; font-family: DIN Alternate, DIN Alternate-Bold; font-weight: 700; text-align: left; color: #262626; } .money{ font-size: 52rpx; font-family: DIN Alternate, DIN Alternate-Bold; font-weight: 700; text-align: left; color: #262626; padding-right: 10rpx; } .icon_close{ width: 40rpx; height: 40rpx; min-width: 40rpx; } } .line{ height: 1px; background: rgba(127,127,127,0.1); } .notice{ font-size: 28rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: #b1b1b1; margin-top: 15rpx; } .notice_red{ font-size: 28rpx; font-family: Verdana, Verdana-Regular; font-weight: 400; text-align: left; color: rgba(206,21,21,0.8); } .btn{ display: flex; align-items: center; justify-content: space-between; margin-top: 40rpx; .btn_cancel{ width: 250rpx; height: 80rpx; line-height: 80rpx; background: #ffffff; border: 2rpx solid #f07423; border-radius: 42rpx; text-align: center; font-size: 28rpx; font-family: Verdana, Verdana-Bold; font-weight: 700; color: #f07423; } .btn_confirm{ width: 250rpx; height: 80rpx; line-height: 80rpx; background: #f07423; border-radius: 40rpx; box-shadow: 0rpx 2rpx 12rpx 0rpx rgba(240,116,35,0.37); text-align: center; font-size: 28rpx; font-family: Verdana, Verdana-Bold; font-weight: 700; color: #ffffff; } } </style>