|
|
|
@ -7,7 +7,7 @@ |
|
|
|
<view class="wallet-aura aura-pink"></view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="wallet-nav" :style="{'padding-top': menuButtonInfo.top +'px'}"> |
|
|
|
<view class="wallet-nav" :style="{'padding-top': navSafeTop + 'px'}"> |
|
|
|
<view class="back-btn" @tap="back"> |
|
|
|
<text>‹</text> |
|
|
|
</view> |
|
|
|
@ -29,7 +29,7 @@ |
|
|
|
<view class="hero-watermark">WALLET</view> |
|
|
|
<view class="hero-copy"> |
|
|
|
<view class="hero-label" @tap.stop="toggleBalance"> |
|
|
|
<text>用户余额（元）</text> |
|
|
|
<text>用户余额</text> |
|
|
|
<view class="eye-badge" :class="{closed: !showBalance}"> |
|
|
|
<view class="eye-line" v-if="showBalance"></view> |
|
|
|
<text class="eye-emoji" v-else>🙈</text> |
|
|
|
@ -45,7 +45,7 @@ |
|
|
|
</view> |
|
|
|
<view class="withdraw-btn" @tap.stop="userCommion('user', balanceUser.depoBal, balanceUser)"> |
|
|
|
<text>提现</text> |
|
|
|
<view class="btn-arrow">↑</view> |
|
|
|
<!-- <view class="btn-arrow">↑</view> --> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
@ -53,23 +53,34 @@ |
|
|
|
<view class="identity-grid"> |
|
|
|
<!-- 配送兼职佣金卡片 --> |
|
|
|
<view v-if="hasWorkerWallet" class="identity-card worker-card enter-card" :class="{active: activeWalletType === 'worker'}" @tap="switchWallet('worker')"> |
|
|
|
<view class="card-title">配送兼职佣金（元）<text class="info-icon">?</text></view> |
|
|
|
<view class="card-title">配送可提现佣金</view> |
|
|
|
<view class="card-value">{{ showBalance ? formatMoney(balanceWorker.depoBalRel) : '••••' }}</view> |
|
|
|
<view class="card-today">今日佣金 {{ showBalance ? formatMoney(balanceWorker.depoBal) : '••••' }}</view> |
|
|
|
<view class="card-link-btn">去查看 ›</view> |
|
|
|
<view class="worker-today-line"> |
|
|
|
今日佣金{{ showBalance ? formatMoney(workerTodayCommission) : '••••' }}<text>次日可提现</text> |
|
|
|
</view> |
|
|
|
<view class="card-link-btn" @tap.stop="userCommion('worker', balanceWorker.depoBalRel, balanceWorker)">提现</view> |
|
|
|
<view class="card-illus">🛵</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 店铺余额卡片 --> |
|
|
|
<view v-if="hasShopWallet" class="identity-card shop-card enter-card" :class="{active: activeWalletType === 'shop'}" @tap="switchWallet('shop')"> |
|
|
|
<view class="card-title">店铺余额（元）<text class="info-icon">?</text></view> |
|
|
|
<view class="card-value">{{ showBalance ? formatMoney(shopTotalBalance) : '••••' }}</view> |
|
|
|
<view class="card-link-btn">去查看 ›</view> |
|
|
|
<view class="card-title">{{currentShopName}}余额</view> |
|
|
|
<view class="card-value">{{ showBalance ? formatMoney(currentShopBalance) : '••••' }}</view> |
|
|
|
<view class="card-today" v-if="shopWallets.length > 1">当前第 {{activeShopIndex + 1}} / {{shopWallets.length}} 个店铺</view> |
|
|
|
<view class="card-link-btn" @tap.stop="userCommion('shop', currentShopBalance, currentShop)">提现</view> |
|
|
|
<view class="card-illus shop-image-illus"> |
|
|
|
<image class="shop-illus-img" src="https://jewel-shop.oss-cn-beijing.aliyuncs.com/f19689fe650a4a439f7d9096d354b47e.png" mode="aspectFit"></image> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
<scroll-view v-if="hasShopWallet && shopWallets.length > 1" scroll-x class="shop-switch-scroll" :show-scrollbar="false"> |
|
|
|
<view class="shop-switch-list"> |
|
|
|
<view class="shop-switch-item" :class="{active: activeWalletType === 'shop' && activeShopIndex === index}" |
|
|
|
v-for="(shop,index) in shopWallets" :key="index" @tap="switchShop(index)"> |
|
|
|
{{getShopName(shop, index)}} |
|
|
|
</view> |
|
|
|
</view> |
|
|
|
</scroll-view> |
|
|
|
|
|
|
|
<!-- 余额明细面板 --> |
|
|
|
<view class="flow-panel enter-card"> |
|
|
|
@ -77,7 +88,7 @@ |
|
|
|
<view class="flow-tabs"> |
|
|
|
<view class="flow-tab active">余额明细</view> |
|
|
|
</view> |
|
|
|
<view class="flow-filter">全部 <text class="filter-caret">▾</text></view> |
|
|
|
<view class="flow-filter">点击不同身份查看余额明细</view> |
|
|
|
</view> |
|
|
|
|
|
|
|
<view class="timeline-list"> |
|
|
|
@ -114,7 +125,7 @@ |
|
|
|
<text class="tip-icon">📢</text> |
|
|
|
<text class="tip-text"><text class="tip-bold">小提示：</text>努力兼职，钱包会鼓鼓的哦 💪</text> |
|
|
|
</view> |
|
|
|
<view class="tip-arrow">→</view> |
|
|
|
<!-- <view class="tip-arrow">→</view> --> |
|
|
|
</view> |
|
|
|
|
|
|
|
<!-- 出层 --> |
|
|
|
@ -166,6 +177,7 @@ |
|
|
|
totalPages: 1, |
|
|
|
commionUrl:'', |
|
|
|
commionAmount:0, |
|
|
|
withdrawMaxAmount: 0, |
|
|
|
linkId:'', |
|
|
|
activeWalletType: 'user', |
|
|
|
activeShopIndex: 0, |
|
|
|
@ -178,6 +190,10 @@ |
|
|
|
} |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
navSafeTop() { |
|
|
|
const top = Number(this.menuButtonInfo && this.menuButtonInfo.top) |
|
|
|
return top && top > 20 ? top : 44 |
|
|
|
}, |
|
|
|
shopWallets() { |
|
|
|
if (Array.isArray(this.balanceShop)) return this.balanceShop |
|
|
|
return this.balanceShop && typeof this.balanceShop === 'object' ? [this.balanceShop] : [] |
|
|
|
@ -197,6 +213,13 @@ |
|
|
|
currentShop() { |
|
|
|
return this.shopWallets[this.activeShopIndex] || this.shopWallets[0] || {} |
|
|
|
}, |
|
|
|
currentShopName() { |
|
|
|
return this.getShopName(this.currentShop, this.activeShopIndex) |
|
|
|
}, |
|
|
|
currentShopBalance() { |
|
|
|
const shop = this.currentShop || {} |
|
|
|
return shop.balance != null ? shop.balance : (shop.depoBal != null ? shop.depoBal : 0) |
|
|
|
}, |
|
|
|
workerTodayCommission() { |
|
|
|
if (!this.balanceWorker) return 0 |
|
|
|
if (this.balanceWorker.todayCommission != null) return this.balanceWorker.todayCommission |
|
|
|
@ -210,10 +233,10 @@ |
|
|
|
}, |
|
|
|
displayRewardLists() { |
|
|
|
return (this.rewardLists || []).map((item, index) => { |
|
|
|
const amountClass = this.amountClass(item.amount) |
|
|
|
const amountClass = this.amountClass(item) |
|
|
|
return Object.assign({}, item, { |
|
|
|
amountClass, |
|
|
|
amountText: this.formatSignedAmount(item.amount), |
|
|
|
amountText: this.formatSignedAmount(item), |
|
|
|
flowIconKey: this.flowIconKey(item.dealingsWay), |
|
|
|
flowEmoji: this.flowEmoji(item.dealingsWay), |
|
|
|
delay: (index * 0.04) + 's' |
|
|
|
@ -249,7 +272,7 @@ |
|
|
|
this.balanceWorker = res.result.worker |
|
|
|
} |
|
|
|
if(res.result.shop){ |
|
|
|
this.balanceShop = res.result.shop |
|
|
|
this.balanceShop = Array.isArray(res.result.shop) ? res.result.shop : [res.result.shop] |
|
|
|
} |
|
|
|
this.syncActiveWallet() |
|
|
|
this.$forceUpdate(); |
|
|
|
@ -266,15 +289,17 @@ |
|
|
|
}) |
|
|
|
}, |
|
|
|
userCommion(type,commion,item){ |
|
|
|
const withdrawAmount = Number(commion) || 0 |
|
|
|
if(type=='user'){ |
|
|
|
this.commionUrl = '/app/returnCommission/handleReturnUser' |
|
|
|
}else if(type=='worker'){ |
|
|
|
this.commionUrl = '/app/returnCommission/handleReturnWorker' |
|
|
|
}else{ |
|
|
|
this.commionUrl = '/app/returnCommission/handleReturn' |
|
|
|
this.shopId = item.id |
|
|
|
this.shopId = item && item.id |
|
|
|
} |
|
|
|
this.commionAmount = commion |
|
|
|
this.commionAmount = this.formatMoney(withdrawAmount) |
|
|
|
this.withdrawMaxAmount = withdrawAmount |
|
|
|
this.commionType = type |
|
|
|
this.submittingWithdraw = false |
|
|
|
this.withdrawRequestId = this.createWithdrawRequestId() |
|
|
|
@ -298,6 +323,9 @@ |
|
|
|
if (this.activeWalletType === 'shop' && this.activeShopIndex >= this.shopWallets.length) { |
|
|
|
this.activeShopIndex = 0 |
|
|
|
} |
|
|
|
if (this.activeWalletType !== 'shop') { |
|
|
|
this.activeShopIndex = 0 |
|
|
|
} |
|
|
|
this.setCurrentLinkId() |
|
|
|
}, |
|
|
|
setCurrentLinkId(){ |
|
|
|
@ -319,13 +347,21 @@ |
|
|
|
switchWallet(type){ |
|
|
|
if (this.activeWalletType === type) return |
|
|
|
this.activeWalletType = type |
|
|
|
if (type === 'shop' && this.activeShopIndex >= this.shopWallets.length) { |
|
|
|
this.activeShopIndex = 0 |
|
|
|
} |
|
|
|
this.setCurrentLinkId() |
|
|
|
}, |
|
|
|
switchShop(index){ |
|
|
|
if (this.activeShopIndex === index) return |
|
|
|
this.activeShopIndex = index |
|
|
|
this.activeWalletType = 'shop' |
|
|
|
this.setCurrentLinkId() |
|
|
|
}, |
|
|
|
getShopName(shop, index) { |
|
|
|
if (!shop) return `店铺${index + 1}` |
|
|
|
return shop.shopName || shop.name || shop.storeName || shop.merchantName || `店铺${index + 1}` |
|
|
|
}, |
|
|
|
loadMoreFlow(){ |
|
|
|
if (this.searchForm.pageNum >= this.totalPages) return |
|
|
|
this.searchForm.pageNum += 1 |
|
|
|
@ -338,8 +374,17 @@ |
|
|
|
return |
|
|
|
} |
|
|
|
const amount = Number(this.commionAmount) |
|
|
|
if(!amount || amount < 1 || amount > 5000){ |
|
|
|
that.tui.toast('单笔提现金额应在1-5000之间') |
|
|
|
const maxAmount = Number(this.withdrawMaxAmount) || 0 |
|
|
|
if(!amount || amount < 1){ |
|
|
|
that.tui.toast('提现金额不能小于1元') |
|
|
|
return |
|
|
|
} |
|
|
|
if(amount > 5000){ |
|
|
|
that.tui.toast('单笔提现金额不能超过5000元') |
|
|
|
return |
|
|
|
} |
|
|
|
if(amount > maxAmount){ |
|
|
|
that.tui.toast('提现金额不能超过可提现金额') |
|
|
|
return |
|
|
|
} |
|
|
|
if(!this.aliName){ |
|
|
|
@ -399,13 +444,16 @@ |
|
|
|
if (!isFinite(num)) return '0.00' |
|
|
|
return num.toFixed(2) |
|
|
|
}, |
|
|
|
amountClass(amount){ |
|
|
|
return Number(amount) < 0 ? 'outcome' : 'income' |
|
|
|
isIncomeFlow(item){ |
|
|
|
return item && Number(item.dealingsType) === 0 |
|
|
|
}, |
|
|
|
formatSignedAmount(amount){ |
|
|
|
const num = Number(amount) |
|
|
|
amountClass(item){ |
|
|
|
return this.isIncomeFlow(item) ? 'income' : 'outcome' |
|
|
|
}, |
|
|
|
formatSignedAmount(item){ |
|
|
|
const num = Number(item && item.amount) |
|
|
|
if (!isFinite(num)) return '+0.00' |
|
|
|
const prefix = num < 0 ? '-' : '+' |
|
|
|
const prefix = this.isIncomeFlow(item) ? '+' : '-' |
|
|
|
return prefix + Math.abs(num).toFixed(2) |
|
|
|
}, |
|
|
|
flowIconKey(title) { |
|
|
|
@ -452,8 +500,13 @@ |
|
|
|
rewardList(){ |
|
|
|
this.loadStatus = 'loading' |
|
|
|
let that = this |
|
|
|
this.searchForm.linkUserId = this.linkId; |
|
|
|
that.tui.request("/mall/coupon/selectRewardByRegionId", "POST", this.searchForm, false, false).then((res) => { |
|
|
|
const params = Object.assign({}, this.searchForm, { |
|
|
|
linkUserId: this.linkId |
|
|
|
}) |
|
|
|
if (this.activeWalletType === 'user') { |
|
|
|
params.excludeDealingsWay = '免单奖励' |
|
|
|
} |
|
|
|
that.tui.request("/mall/coupon/selectRewardByRegionId", "POST", params, false, false).then((res) => { |
|
|
|
that.loadStatus = 'nomore'; |
|
|
|
if (res.code == 200) { |
|
|
|
that.totalPages = res.result.pages |
|
|
|
@ -480,17 +533,20 @@ |
|
|
|
<style lang="scss"> |
|
|
|
page { |
|
|
|
width: 100%; |
|
|
|
min-height: 100%; |
|
|
|
height: 100%; |
|
|
|
font-size: 24rpx; |
|
|
|
background: #F3FFF8; |
|
|
|
color: #153A2E; |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
|
|
|
|
.wallet-page { |
|
|
|
width: 100%; |
|
|
|
min-height: 100vh; |
|
|
|
height: 100vh; |
|
|
|
position: relative; |
|
|
|
overflow: hidden; |
|
|
|
display: flex; |
|
|
|
flex-direction: column; |
|
|
|
background: |
|
|
|
radial-gradient(circle at 18% 8%, rgba(205, 255, 206, 0.78), rgba(205, 255, 206, 0) 220rpx), |
|
|
|
radial-gradient(circle at 88% 10%, rgba(142, 239, 255, 0.5), rgba(142, 239, 255, 0) 300rpx), |
|
|
|
@ -547,11 +603,13 @@ |
|
|
|
.wallet-nav { |
|
|
|
position: relative; |
|
|
|
z-index: 2; |
|
|
|
height: 124rpx; |
|
|
|
flex: none; |
|
|
|
min-height: 132rpx; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
padding-left: 32rpx; |
|
|
|
padding-right: 32rpx; |
|
|
|
padding-bottom: 10rpx; |
|
|
|
box-sizing: content-box; |
|
|
|
} |
|
|
|
|
|
|
|
@ -586,7 +644,9 @@ |
|
|
|
.wallet-scroll { |
|
|
|
position: relative; |
|
|
|
z-index: 1; |
|
|
|
height: calc(100vh - 124rpx); |
|
|
|
flex: 1; |
|
|
|
height: 0; |
|
|
|
min-height: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.wallet-content { |
|
|
|
@ -827,9 +887,9 @@ |
|
|
|
|
|
|
|
.identity-card { |
|
|
|
position: relative; |
|
|
|
min-height: 264rpx; |
|
|
|
min-height: 238rpx; |
|
|
|
border-radius: 34rpx; |
|
|
|
padding: 30rpx 26rpx 26rpx; |
|
|
|
padding: 26rpx 22rpx 68rpx; |
|
|
|
box-sizing: border-box; |
|
|
|
overflow: hidden; |
|
|
|
display: flex; |
|
|
|
@ -864,7 +924,7 @@ |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
gap: 8rpx; |
|
|
|
font-size: 24rpx; |
|
|
|
font-size: 22rpx; |
|
|
|
font-weight: 700; |
|
|
|
color: rgba(21, 58, 46, 0.62); |
|
|
|
} |
|
|
|
@ -882,9 +942,9 @@ |
|
|
|
} |
|
|
|
|
|
|
|
.card-value { |
|
|
|
margin-top: 16rpx; |
|
|
|
font-size: 52rpx; |
|
|
|
line-height: 58rpx; |
|
|
|
margin-top: 12rpx; |
|
|
|
font-size: 46rpx; |
|
|
|
line-height: 50rpx; |
|
|
|
font-weight: 900; |
|
|
|
letter-spacing: -1rpx; |
|
|
|
color: #153A2E; |
|
|
|
@ -897,36 +957,58 @@ |
|
|
|
color: #12B76A; |
|
|
|
} |
|
|
|
|
|
|
|
.worker-today-line { |
|
|
|
margin-top: 8rpx; |
|
|
|
max-width: 230rpx; |
|
|
|
font-size: 20rpx; |
|
|
|
line-height: 26rpx; |
|
|
|
font-weight: 900; |
|
|
|
color: #12B76A; |
|
|
|
white-space: nowrap; |
|
|
|
position: relative; |
|
|
|
z-index: 1; |
|
|
|
} |
|
|
|
|
|
|
|
.worker-today-line text { |
|
|
|
margin-left: 6rpx; |
|
|
|
font-size: 18rpx; |
|
|
|
font-weight: 700; |
|
|
|
color: rgba(18, 183, 106, 0.66); |
|
|
|
} |
|
|
|
|
|
|
|
.card-link-btn { |
|
|
|
margin-top: auto; |
|
|
|
width: fit-content; |
|
|
|
padding: 12rpx 26rpx; |
|
|
|
padding: 9rpx 22rpx; |
|
|
|
border-radius: 999rpx; |
|
|
|
background: #FFFFFF; |
|
|
|
box-shadow: 0 8rpx 20rpx rgba(28, 122, 91, 0.08); |
|
|
|
font-size: 23rpx; |
|
|
|
font-weight: 800; |
|
|
|
color: #137A5A; |
|
|
|
position: relative; |
|
|
|
z-index: 1; |
|
|
|
position: absolute; |
|
|
|
left: 22rpx; |
|
|
|
bottom: 18rpx; |
|
|
|
z-index: 2; |
|
|
|
} |
|
|
|
|
|
|
|
.card-illus { |
|
|
|
position: absolute; |
|
|
|
right: 12rpx; |
|
|
|
bottom: 12rpx; |
|
|
|
font-size: 96rpx; |
|
|
|
right: 8rpx; |
|
|
|
bottom: 8rpx; |
|
|
|
font-size: 72rpx; |
|
|
|
line-height: 1; |
|
|
|
filter: drop-shadow(0 10rpx 18rpx rgba(28, 122, 91, 0.14)); |
|
|
|
animation: illusFloat 5s ease-in-out infinite alternate; |
|
|
|
pointer-events: none; |
|
|
|
opacity: 0.9; |
|
|
|
} |
|
|
|
|
|
|
|
.shop-image-illus { |
|
|
|
right: -16rpx; |
|
|
|
bottom: -30rpx; |
|
|
|
width: 160rpx; |
|
|
|
height: 160rpx; |
|
|
|
bottom: -20rpx; |
|
|
|
width: 120rpx; |
|
|
|
height: 120rpx; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
@ -934,11 +1016,45 @@ |
|
|
|
} |
|
|
|
|
|
|
|
.shop-illus-img { |
|
|
|
width: 160rpx; |
|
|
|
height: 160rpx; |
|
|
|
width: 120rpx; |
|
|
|
height: 120rpx; |
|
|
|
display: block; |
|
|
|
} |
|
|
|
|
|
|
|
.shop-switch-scroll { |
|
|
|
width: 100%; |
|
|
|
margin-top: 18rpx; |
|
|
|
white-space: nowrap; |
|
|
|
} |
|
|
|
|
|
|
|
.shop-switch-list { |
|
|
|
display: inline-flex; |
|
|
|
gap: 16rpx; |
|
|
|
padding: 0 2rpx 4rpx; |
|
|
|
} |
|
|
|
|
|
|
|
.shop-switch-item { |
|
|
|
max-width: 240rpx; |
|
|
|
height: 60rpx; |
|
|
|
line-height: 60rpx; |
|
|
|
padding: 0 24rpx; |
|
|
|
border-radius: 999rpx; |
|
|
|
background: rgba(255, 255, 255, 0.72); |
|
|
|
color: rgba(21, 58, 46, 0.58); |
|
|
|
font-size: 24rpx; |
|
|
|
font-weight: 800; |
|
|
|
overflow: hidden; |
|
|
|
text-overflow: ellipsis; |
|
|
|
white-space: nowrap; |
|
|
|
box-shadow: inset 0 0 0 1rpx rgba(21, 58, 46, 0.06); |
|
|
|
} |
|
|
|
|
|
|
|
.shop-switch-item.active { |
|
|
|
background: linear-gradient(90deg, #19C889, #65E08D); |
|
|
|
color: #fff; |
|
|
|
box-shadow: 0 10rpx 22rpx rgba(18, 183, 106, 0.18); |
|
|
|
} |
|
|
|
|
|
|
|
/* ---------- 余额明细面板 ---------- */ |
|
|
|
.flow-panel { |
|
|
|
margin-top: 28rpx; |
|
|
|
@ -990,7 +1106,7 @@ |
|
|
|
border-radius: 999rpx; |
|
|
|
background: #F2FFF8; |
|
|
|
border: 1rpx solid rgba(28, 122, 91, 0.06); |
|
|
|
font-size: 24rpx; |
|
|
|
font-size: 20rpx; |
|
|
|
font-weight: 700; |
|
|
|
color: rgba(21, 58, 46, 0.58); |
|
|
|
display: flex; |
|
|
|
|
wangfukang
2 months ago