284 lines
7.6 KiB
Vue
284 lines
7.6 KiB
Vue
<template>
|
|
<view class="purse_warp">
|
|
<header-component
|
|
:leftTitle="$t('purse.title')"
|
|
left-path-type="switchTab"
|
|
left-path="/pages/mine/mine"
|
|
/>
|
|
<view class="purse_content_warp">
|
|
<view
|
|
v-for="(item, vIndex) in balanceList"
|
|
:key="item.id"
|
|
class="purse_warp_item"
|
|
@click="jumpBonus(item)"
|
|
>
|
|
<view class="purse_item_title">
|
|
<view class="purse_item_title-left">
|
|
<up-image
|
|
:src="`https://static.tbmall.xin/static/mine-purse/${item.categoty}.png`"
|
|
width="22"
|
|
height="22"
|
|
bgColor="#f1f6ff00"
|
|
class="purse_amount"
|
|
></up-image>
|
|
<view class="title">{{ item.name }}</view>
|
|
<up-image
|
|
src="/static/common/right_soild.png"
|
|
width="10"
|
|
height="10"
|
|
bgColor="#fff"
|
|
class="right_soild"
|
|
></up-image>
|
|
</view>
|
|
|
|
<view class="purse_item_title-right">
|
|
<view class="button exchange_button" @click.stop="jumpInfo(item, 'withdraw')" v-if="vIndex == 4">
|
|
提现
|
|
</view>
|
|
<view v-for="(btn, index) in getOperationButtons(item)" :key="index" :type="btn.type" class="button"
|
|
:class="btn.type + '_button'" @click.stop="jumpInfo(item, btn.type)">{{ btn.text }}</view>
|
|
</view>
|
|
</view>
|
|
|
|
<!-- 下 -->
|
|
<view class="purse_item_bottom">
|
|
<view class="bottom_item">
|
|
<view class="bottom_item_amount">{{ item.curAmount || 0 }}</view>
|
|
<view class="bottom_item_title">{{
|
|
item.categoty === "raffle" ? "可用次数" : "可用余额"
|
|
}}</view>
|
|
</view>
|
|
|
|
<view class="bottom_item" @click.stop="onTip(vIndex)">
|
|
<view class="bottom_item_lock">{{ item.lockAmount || 0 }}</view>
|
|
<view class="bottom_item_title"
|
|
>{{ item.categoty === "raffle" ? "不可用次数" : "不可用余额" }}
|
|
<up-image
|
|
src="/static/common/tips.png"
|
|
width="12"
|
|
height="12"
|
|
bgColor="#fff"
|
|
style="margin-left: 8rpx; margin-top: 4rpx"
|
|
v-if="item.categoty == 'balance'"
|
|
/></view>
|
|
</view>
|
|
</view>
|
|
|
|
<view
|
|
class="bottom_item_tip"
|
|
v-if="item.categoty == 'balance' && activeTip == vIndex"
|
|
>抽奖7天后释放到可用余额中</view
|
|
>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import Header from "@/components/header.vue";
|
|
import { getAcctBalance } from "@/api/finance.js";
|
|
import { getValue } from "@/utils/enumUtils.js";
|
|
import { formatDate, handleAmount } from "@/utils/index.js";
|
|
|
|
export default {
|
|
components: { headerComponent: Header },
|
|
data() {
|
|
return {
|
|
balanceLoading: false,
|
|
balanceList: [],
|
|
activeTip: -1,
|
|
};
|
|
},
|
|
onLoad() {
|
|
this.getAcctBalance();
|
|
},
|
|
methods: {
|
|
getValue,
|
|
formatDate,
|
|
handleAmount,
|
|
getOperationButtons(item) {
|
|
return [
|
|
// { type: 'recharge', text: '充值', show: item.isRecharge },
|
|
{ type: "withdraw", text: "提现", show: item.isWithdrawal },
|
|
{ type: "exchange", text: "兑换", show: item.isExchange },
|
|
].filter((btn) => btn.show);
|
|
},
|
|
|
|
// 跳转到详情
|
|
jumpBonus(item) {
|
|
uni.navigateTo({
|
|
url:
|
|
"/pages/mine_package/mine_purse_log/mine_purse_log?category=" +
|
|
item.categoty +
|
|
"&lockId=" +
|
|
item.lockId +
|
|
"&curId=" +
|
|
item.curId +
|
|
"&preId=" +
|
|
item.preId,
|
|
});
|
|
},
|
|
// 查询余额
|
|
async getAcctBalance() {
|
|
this.balanceLoading = true;
|
|
const resp = await getAcctBalance();
|
|
let data = [];
|
|
if (resp && resp.bizcode === 100) {
|
|
data = resp.data || [];
|
|
}
|
|
this.balanceList = data;
|
|
this.balanceLoading = false;
|
|
},
|
|
// 提现
|
|
jumpInfo(row, type) {
|
|
console.log("row", row);
|
|
if (type === "withdraw") {
|
|
// 提现
|
|
// uni.navigateTo({
|
|
// url: "/pages/mine_package/mine_purse_bonus_withdraw/mine_purse_bonus_withdraw?amount=" + row.curAmount + "&category=" + row.categoty,
|
|
|
|
// })
|
|
uni.navigateTo({
|
|
url: "/pages/rwa_package/account/withdraw?type=0",
|
|
});
|
|
} else if (type === "recharge") {
|
|
// 充值
|
|
uni.navigateTo({
|
|
url: "/pages/rwa_package/account/withdraw?type=1",
|
|
});
|
|
// uni.navigateTo({
|
|
// url: "/pages/mine_package/mine_purse_recharge/mine_purse_recharge?amount=" + row.curAmount + "&category=" + row.categoty,
|
|
// })
|
|
} else if (type === "exchange") {
|
|
// 兑换
|
|
// uni.navigateTo({
|
|
// url: "/pages/mine_package/mine_purse_exchange/mine_purse_exchange?amount=" + row.curAmount + "&category=" + row.categoty,
|
|
// })
|
|
uni.navigateTo({
|
|
url: "/pages/rwa_package/shop/fen-shop",
|
|
});
|
|
} else if (type === "transfer") {
|
|
console.log("transfer转出...");
|
|
}
|
|
},
|
|
onTip(index) {
|
|
if (index == this.activeTip) {
|
|
this.activeTip = -1;
|
|
return;
|
|
}
|
|
this.activeTip = index;
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.purse_warp {
|
|
height: 100%;
|
|
overflow-y: hidden;
|
|
background-color: $app-bj;
|
|
|
|
.purse_content_warp {
|
|
padding: 30rpx 30rpx 10rpx;
|
|
height: calc(100vh - 218rpx);
|
|
overflow-y: auto;
|
|
}
|
|
|
|
.purse_warp_item {
|
|
margin-bottom: 30rpx;
|
|
background: #ffffff;
|
|
border-radius: 16rpx;
|
|
padding: 32rpx;
|
|
|
|
.purse_item_title {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
|
|
.purse_item_title-left {
|
|
display: flex;
|
|
align-items: center;
|
|
|
|
.title {
|
|
font-weight: 500;
|
|
font-size: 30rpx;
|
|
color: #333333;
|
|
}
|
|
|
|
.purse_amount {
|
|
margin-right: 15rpx;
|
|
margin-top: 6rpx;
|
|
}
|
|
|
|
.right_soild {
|
|
margin-left: 12rpx;
|
|
}
|
|
}
|
|
|
|
.purse_item_title-right {
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
.button {
|
|
border-radius: 12rpx;
|
|
width: 120rpx;
|
|
height: 60rpx;
|
|
font-weight: 500;
|
|
font-size: 28rpx;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
}
|
|
|
|
.exchange_button {
|
|
background: #ffffff;
|
|
color: #7934f6;
|
|
border: 2rpx solid #7934f6;
|
|
}
|
|
|
|
.recharge_button {
|
|
background: linear-gradient(270deg, #b164fb 0%, #7934f6 100%);
|
|
color: #fff;
|
|
}
|
|
}
|
|
}
|
|
|
|
.purse_item_bottom {
|
|
display: flex;
|
|
justify-content: space-between;
|
|
|
|
.bottom_item {
|
|
margin-top: 16rpx;
|
|
|
|
.bottom_item_amount {
|
|
font-weight: bold;
|
|
font-size: 36rpx;
|
|
color: #333333;
|
|
}
|
|
|
|
.bottom_item_lock {
|
|
font-weight: bold;
|
|
font-size: 36rpx;
|
|
color: #999999;
|
|
text-align: end;
|
|
}
|
|
|
|
.bottom_item_title {
|
|
margin-top: 16rpx;
|
|
font-size: 20rpx;
|
|
color: #999999;
|
|
display: flex;
|
|
align-items: center;
|
|
}
|
|
}
|
|
}
|
|
|
|
.bottom_item_tip {
|
|
font-size: 20rpx;
|
|
color: #999999;
|
|
text-align: end;
|
|
margin-top: 5rpx;
|
|
}
|
|
}
|
|
}
|
|
</style>
|