From 56797d44dfb07d7d5ec998e81161d83214dce694 Mon Sep 17 00:00:00 2001
From: admin <344137771@qq.com>
Date: Wed, 14 Jan 2026 17:43:34 +0800
Subject: [PATCH] 1
---
src/layouts/BasicLayout.vue | 5 +
src/api/home.js | 8 ++
src/views/capital/withdrawallist.vue | 4
src/components/NotificationBadge/index.vue | 154 +++++++++++++++++++++++++++++++++++++++++++++++++++
4 files changed, 168 insertions(+), 3 deletions(-)
diff --git a/src/api/home.js b/src/api/home.js
index 816ab5e..a4fed22 100644
--- a/src/api/home.js
+++ b/src/api/home.js
@@ -37,6 +37,7 @@
adminsetSiteStyle: '/api/admin/setSiteStyle.do', // 设置网站风格
admingetSiteStyle: '/api/admin/getSiteStyle.do', // 获取网站风格
dksp: '/admin/dksp.do', // 通过||拒绝贷款
+ pendingCount: '/admin/notification/pendingCount.do', // 获取待处理数量
}
/**
@@ -250,6 +251,13 @@
})
}
+export function getPendingCount() {
+ return request({
+ url: userApi.pendingCount,
+ method: 'post',
+ })
+}
+
export function userdelete(parameter) {
return request({
url: userApi.userdelete,
diff --git a/src/components/NotificationBadge/index.vue b/src/components/NotificationBadge/index.vue
new file mode 100644
index 0000000..47c05ed
--- /dev/null
+++ b/src/components/NotificationBadge/index.vue
@@ -0,0 +1,154 @@
+<template>
+ <div v-if="totalCount > 0" class="notification-badge">
+ <div class="badge-wrapper" @click="handleClick">
+ <a-badge :count="totalCount" :number-style="{ backgroundColor: '#ff4d4f' }">
+ <a-icon type="bell" :style="{ fontSize: '24px', color: '#1890ff', cursor: 'pointer' }" />
+ </a-badge>
+ </div>
+ <div class="notification-popover" v-if="showPopover" @click.stop>
+ <div class="notification-item" @click="goToRecharge">
+ <span>充值待处理</span>
+ <a-badge :count="rechargeCount" :number-style="{ backgroundColor: '#ff4d4f' }" />
+ </div>
+ <div class="notification-item" @click="goToWithdraw">
+ <span>提现待处理</span>
+ <a-badge :count="withdrawCount" :number-style="{ backgroundColor: '#ff4d4f' }" />
+ </div>
+ <div class="notification-item" @click="goToAuth">
+ <span>实名认证待处理</span>
+ <a-badge :count="authCount" :number-style="{ backgroundColor: '#ff4d4f' }" />
+ </div>
+ </div>
+ <div v-if="showPopover" class="popover-mask" @click="closePopover"></div>
+ </div>
+</template>
+
+<script>
+import { getPendingCount } from '@/api/home'
+
+export default {
+ name: 'NotificationBadge',
+ data() {
+ return {
+ rechargeCount: 0,
+ withdrawCount: 0,
+ authCount: 0,
+ totalCount: 0,
+ showPopover: false,
+ timer: null
+ }
+ },
+ mounted() {
+ this.fetchPendingCount()
+ this.startPolling()
+ document.addEventListener('click', this.handleDocumentClick)
+ },
+ beforeDestroy() {
+ this.stopPolling()
+ document.removeEventListener('click', this.handleDocumentClick)
+ },
+ methods: {
+ fetchPendingCount() {
+ getPendingCount()
+ .then((res) => {
+ if (res.status === 0 && res.data) {
+ this.rechargeCount = res.data.rechargeCount || 0
+ this.withdrawCount = res.data.withdrawCount || 0
+ this.authCount = res.data.authCount || 0
+ this.totalCount = res.data.totalCount || 0
+ }
+ })
+ .catch((error) => {
+ console.error('获取待处理数量失败', error)
+ })
+ },
+ startPolling() {
+ this.timer = setInterval(() => {
+ this.fetchPendingCount()
+ }, 30000) // 每30秒轮询一次
+ },
+ stopPolling() {
+ if (this.timer) {
+ clearInterval(this.timer)
+ this.timer = null
+ }
+ },
+ handleClick(e) {
+ e.stopPropagation()
+ this.showPopover = !this.showPopover
+ },
+ closePopover() {
+ this.showPopover = false
+ },
+ handleDocumentClick(e) {
+ if (this.showPopover && !this.$el.contains(e.target)) {
+ this.showPopover = false
+ }
+ },
+ goToRecharge() {
+ this.$router.push('/capital/rechargelist')
+ this.showPopover = false
+ },
+ goToWithdraw() {
+ this.$router.push('/capital/withdrawallist')
+ this.showPopover = false
+ },
+ goToAuth() {
+ this.$router.push('/userlist')
+ this.showPopover = false
+ }
+ }
+}
+</script>
+
+<style lang="less" scoped>
+.notification-badge {
+ position: fixed;
+ right: 30px;
+ bottom: 30px;
+ z-index: 1000;
+}
+
+.badge-wrapper {
+ cursor: pointer;
+}
+
+.popover-mask {
+ position: fixed;
+ top: 0;
+ left: 0;
+ right: 0;
+ bottom: 0;
+ z-index: 999;
+}
+
+.notification-popover {
+ position: absolute;
+ bottom: 50px;
+ right: 0;
+ background: #fff;
+ border-radius: 4px;
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
+ padding: 12px 0;
+ min-width: 200px;
+}
+
+.notification-item {
+ padding: 12px 16px;
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ cursor: pointer;
+ transition: background-color 0.3s;
+
+ &:hover {
+ background-color: #f5f5f5;
+ }
+
+ span {
+ font-size: 14px;
+ color: #333;
+ }
+}
+</style>
+
diff --git a/src/layouts/BasicLayout.vue b/src/layouts/BasicLayout.vue
index 9e8803a..35eebe4 100644
--- a/src/layouts/BasicLayout.vue
+++ b/src/layouts/BasicLayout.vue
@@ -48,6 +48,7 @@
<global-footer />
</template>
<router-view />
+ <notification-badge />
</pro-layout>
</template>
@@ -61,6 +62,7 @@
import RightContent from '@/components/GlobalHeader/RightContent'
import GlobalFooter from '@/components/GlobalFooter'
import Ads from '@/components/Other/CarbonAds'
+import NotificationBadge from '@/components/NotificationBadge'
export default {
name: 'BasicLayout',
@@ -68,7 +70,8 @@
SettingDrawer,
RightContent,
GlobalFooter,
- Ads
+ Ads,
+ NotificationBadge
},
data () {
return {
diff --git a/src/views/capital/withdrawallist.vue b/src/views/capital/withdrawallist.vue
index 85ab39b..04e3aca 100644
--- a/src/views/capital/withdrawallist.vue
+++ b/src/views/capital/withdrawallist.vue
@@ -127,8 +127,8 @@
<div slot="footer" style="display: flex; justify-content: center; align-items: center">
<a-button type="primary" style="background-color: " @click="OkeditOrderdialog(3)">驳回</a-button>
<a-button type="primary" @click="OkeditOrderdialog(2)">通过</a-button>
- <a-button type="primary" @click="OkeditOrderdialog(1)">代付1</a-button>
- <a-button type="primary" @click="OkeditOrderdialog(4)">代付2</a-button>
+ <!-- <a-button type="primary" @click="OkeditOrderdialog(1)">代付1</a-button>
+ <a-button type="primary" @click="OkeditOrderdialog(4)">代付2</a-button> -->
</div>
</a-modal>
</page-header-wrapper>
--
Gitblit v1.9.3