添加百亿返补未读消息提示

This commit is contained in:
wangxiaowei 2024-08-09 15:09:17 +08:00
parent f68fbe2e2a
commit 6c7efbc45b
3 changed files with 81 additions and 35 deletions

@ -103,17 +103,18 @@
}).then(({
data
}) => {
this.doneOrder = data.doneOrder;
this.highSubsidy = data.highSubsidy;
this.getSubsidy = data.getSubsidy;
this.queuesNumber = data.queuesNumber;
this.queuesMoney = data.queuesMoney;
this.doneOrder = data.doneOrder
this.highSubsidy = data.highSubsidy
this.getSubsidy = data.getSubsidy
this.queuesNumber = data.queuesNumber
this.queuesMoney = data.queuesMoney
let curPageData = data.list;
let curPageLen = curPageData.length;
let hasNext = !!data.more;
if (page.num == 1) this.orderList = [];
this.orderList = this.orderList.concat(curPageData);
this.mescroll.endSuccess(curPageLen, hasNext);
this.$emit('changeUnreadBillions', data.unreadBillions)
})
}
}

@ -54,12 +54,18 @@
</view>
</view>
<tabs :current="active" @change="changeShow" bar-width="60" :is-scroll="false">
<tab v-for="(item, index) in order" :key="index" :name="item.name">
<subsidy-list :i="index" :index="active"></subsidy-list>
</tab>
</tabs>
<view class="unreadBlock" style="position: relative;">
<tabs :current="active" @change="changeShow" bar-width="60" :is-scroll="false">
<tab v-for="(item, index) in order" :key="index" :name="item.name">
<subsidy-list :i="index" :index="active" @changeUnreadBillions="changeUnreadBillions"></subsidy-list>
</tab>
</tabs>
<view class="unreadNum" v-if="dot">
{{dot > 99 ? '99+' : dot}}
</view>
</view>
<!-- 充值成功 -->
<u-popup class="pay-popup" v-model="showPopup" closeable round mode="center">
<view class="content bg-white">
@ -78,6 +84,9 @@
applyBillionsWithdrawl,
rechargeBalance
} from "@/api/user";
import {mapGetters} from 'vuex'
import subsidyList from './components/subsidy-list.vue'
export default {
components: {
@ -86,11 +95,10 @@
data() {
return {
tabsList: [
// {name: '充值到本地余额'},
{name: '充值到本地余额'},
{name: '补贴提现'}
],
// currentTab: 0,
currentTab: 1,
currentTab: 0,
// Tabs滑块样式
styleTabsBarStyle: {
bottom: '12rpx',
@ -102,28 +110,38 @@
},
active: -1,
order: [{
name: '排队中',
name: '排队中'
}, {
name: '已完成',
name: '已完成'
}],
dot: 0,
widthDrawConfig: [],
form: {
recharge_money: '', // 充值金额
withdrawl_money: '', // 提现金额
},
showPopup: false,
tipsText: ''
tipsText: '',
currentTabs: 0
};
},
onLoad(options) {
this.changeShow(0);
this.getBillionsWithdrawConfigFun();
uni.$on('refreshBillionsWithdrawConfigFun', this.getBillionsWithdrawConfigFun)
if (options && options.unread) {
this.order[1].dot = options.unread
}
},
onUnload() {
uni.$off('refreshBillionsWithdrawConfigFun')
},
methods: {
changeOrderTab(index) {
this.currentTabs = index;
},
async getBillionsWithdrawConfigFun() {
const {
code,
@ -278,6 +296,9 @@
})
}
},
changeUnreadBillions(e) {
this.dot = e
}
},
watch: {
widthDrawConfig() {
@ -318,6 +339,22 @@
overflow-y: scroll;
}
.unreadBlock {
position: relative;
.unreadNum {
position: absolute;
right: 13%;
top: 8rpx;
border: 1rpx solid #ee0a24;
color: $-color-primary;
border-radius: 28rpx;
font-size: 22rpx;
min-width: 28rpx;
height: 28rpx;
padding: 0 6rpx;
}
}
.pay-popup {
.content {
padding: 40rpx 0;

@ -73,7 +73,10 @@
<router-link v-if="appConfig.show_my_refund == 1" class="user-assests-item"
to="/bundle_b/pages/subsidy_shop/subsidy_shop">
<view class="flex-col col-center">
<view>
<view class="refund-badge">
<view v-if="userInfo.unread_billions" class="badge xs flex row-center bg-white">
{{userInfo.unread_billions > 99 ? '99+' : userInfo.unread_billions}}
</view>
<image :src="appConfig.my_refund_image"></image>
</view>
<view class="sm m-t-10 bold">
@ -401,6 +404,20 @@
};
</script>
<style lang="scss" scoped>
.badge {
padding: 0 6rpx;
min-width: 28rpx;
height: 28rpx;
border-radius: 28rpx;
box-sizing: border-box;
border: 1rpx solid $-color-primary;
color: $-color-primary;
position: absolute;
left: 33rpx;
top: -10rpx;
z-index: 2;
}
.user {
background-image: url(https://zjeloong.oss-cn-hangzhou.aliyuncs.com/uniapp/my_topbg.png);
background-size: 100% auto;
@ -444,12 +461,13 @@
background-color: #ee0a24;
border: 2rpx solid #FFFFFF;
color: $-color-primary;
border-radius: 100%;
border-radius: 28rpx;
top: 6rpx;
right: 0rpx;
font-size: 22rpx;
min-width: 16rpx;
height: 16rpx;
min-width: 28rpx;
height: 28rpx;
padding: 0 6rpx;
}
}
@ -470,6 +488,10 @@
.user-assests-item {
flex: 1;
.refund-badge {
position: relative;
}
}
.xl {
@ -519,20 +541,6 @@
width: 25%;
}
.badge {
padding: 0 6rpx;
min-width: 28rpx;
height: 28rpx;
border-radius: 28rpx;
box-sizing: border-box;
border: 1rpx solid $-color-primary;
color: $-color-primary;
position: absolute;
left: 33rpx;
top: -10rpx;
z-index: 2;
}
.nav-icon {
width: 52rpx;
height: 52rpx;