新大宝股票管理后台
1
admin
2026-01-14 56797d44dfb07d7d5ec998e81161d83214dce694
1
3 files modified
1 files added
171 ■■■■■ changed files
src/api/home.js 8 ●●●●● patch | view | raw | blame | history
src/components/NotificationBadge/index.vue 154 ●●●●● patch | view | raw | blame | history
src/layouts/BasicLayout.vue 5 ●●●● patch | view | raw | blame | history
src/views/capital/withdrawallist.vue 4 ●●●● patch | view | raw | blame | history
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,
src/components/NotificationBadge/index.vue
New file
@@ -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>
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 {
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>