1

admin

2026-01-07 29f3a095dc58860849cdaa0b057b9fab495e5f6d

 src/page/newUser/index.vue

@@ -213,11 +213,21 @@
          </template>
</van-popover> -->

        <img class="xxzx" src="@/assets/img/消息中心.png" @click="$router.push('/notify')" />
        <!-- <img class="xxzx" src="@/assets/img/消息中心.png" @click="$router.push('/notify')" /> -->

        <!-- 小铃铛图标，带红点提示 -->
        <div class="rety">
          <div class="lingdang-wrapper" @click="$router.push('/notify')" v-if="isLoggedIn">
            <img class="lingdang" src="@/assets/img/消息中心.png" alt="" />
            <span v-if="unreadCount > 0" class="lingdang-badge"></span>
          </div>
        </div>
      </div>
      <div class="userHead">
        <div class="tl">
          <img class="touxiang" src="~@/assets/imgRed/touxiang.png" />
          <img class="touxiang" :src="userInfo.photoUrl" v-if="userInfo.photoUrl" />
          <img class="touxiang" src="~@/assets/imgRed/touxiang.png" v-else />
          
          <div class="mingzi">
            <p>{{ userInfo.phone ? userInfo.phone : userInfo.phone }}</p>
            <div class="feae" @click="$router.push('/smrz')">
@@ -348,9 +358,9 @@
      </div>

      <div class="congz">
        <a @click="$router.push('/recharge')" class="tx"> {{ $t("jy522") }}</a>
        <a @click="$router.push('/withdraw')"> {{ $t("jy521") }}</a>
        <!-- <a @click="getHeaderlink()"> {{ $t("jy521") }}</a> -->
        <a @click="$router.push('/recharge')" class="tx"> {{ $t("jy522") }}</a>
        <!-- <a @click="rechargeMsg()" class="tx"> {{ $t("jy522") }}</a> -->
      </div>
    </div>
@@ -388,7 +398,7 @@
        <p>{{ $t("hj247") }}</p>
      </div>
      <div class="bl" @click="getHeaderlink(4)">
        <img src="../../assets/img/icon_conversion.svg" />
        <img src="../../assets/img/kf.png" />
        <p>{{ $t("jy186") }}</p>
      </div>
    </div>
@@ -482,15 +492,58 @@
          icon: require("@/assets/ico/english.png"),
          lang: "en"
        }
      ]
      ],
      unreadCount: 0,
      messageTimer: null,
    };
  },
  components: {},
  computed: {
    isLoggedIn() {
      return !!window.localStorage.getItem("USERTOKEN");
    }
  },
  created() {
    this.getUserInfo();
    this.getInfoSite();
  },
  mounted() {
    // 如果已登录，获取未读消息数
    if (this.isLoggedIn) {
      this.getUnreadCount();
      this.startMessagePolling();
    }
  },
  beforeDestroy() {
    if (this.messageTimer) {
      clearInterval(this.messageTimer);
    }
  },
  methods: {
    // 获取未读消息数
    async getUnreadCount() {
      try {
        const data = await api.getUnreadCount();
        if (data && data.status === 0) {
          this.unreadCount = data.data || 0;
        } else {
          this.unreadCount = 0;
        }
      } catch (error) {
        console.error('获取未读消息数失败:', error);
        this.unreadCount = 0;
      }
    },
    // 开始轮询未读消息数（每30秒）
    startMessagePolling() {
      if (this.messageTimer) {
        clearInterval(this.messageTimer);
      }
      this.messageTimer = setInterval(() => {
        if (this.isLoggedIn) {
          this.getUnreadCount();
        }
      }, 30000);
    },
    rechargeMsg(msg) {
      Toast(this.$t("jy527"));
    },
@@ -707,7 +760,55 @@
};
</script>

<style scoped>
<style lang="less" scoped>
.rety {
  display: flex;
  align-items: center;

  // 小铃铛图标容器
  .lingdang-wrapper {
    position: relative;
    margin-left: auto;
    cursor: pointer;
    display: inline-block;

    .lingdang {
      width: 0.55rem;
      height: 0.55rem;
      display: block;
    }

    // 小铃铛红点提示
    .lingdang-badge {
      position: absolute;
      top: -0.05rem;
      right: -0.05rem;
      width: 0.16rem;
      height: 0.16rem;
      background-color: #ff4d4f;
      border-radius: 50%;
      border: 0.02rem solid #fff;
      display: block;
      animation: pulse 2s infinite;
    }
  }

  .yf {
    width: 0.51rem;
    height: 0.51rem;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAmCAYAAACoPemuAAAAAXNSR0IArs4c6QAAAzdJREFUWEftmE2IlVUYx39/k8SoFoVKofmBFIFfG6NQRrBapGKjy9okbUQKR4mQUafyAxEFjSJBCFxEEkI2i7GPUWFqZdEiZxej0WBCpgUSNtDiL8943st777z3exYj3GdzL+95zjm/83+f8zznvGKKmqYoF/cnmO13gD7gkaTsn8B6ST83o7Tt54F+YHbqdxt4T9LxauNUVcz2PmBvQceAekHS/43A2X4QuASsKPDvk7S/aJxCMNvvx4pSh7+As8BiYG16dhLYKsm14GxPAz4F3kh+F4ERYBMwKz3bI+lg5TgTwGwHUICFBdSLkoZtzwRCrWdT25cJLnwmmO0ngBPAq6lxGHhO0pjtJUBAVoUrA7Md8fRBDuolSZezWW3PA34A5qdn/wKfAV8DV2B8My0ENgCvAQ8nv9/SAuN33GwvBS7k4HolHcraS2C2I54irjKlyqByAz4JnAa6ar3GXFtM/rqk2DhlZnsZcD4Ht0vS4XAaB7O9GziQg3pZ0i/VJrYd/UKR2LVFQR1dfwKOAmdqxWIB3LuSjsh2D3AsQdwEQqmqUAWrXhSxA4SSYX8AP0oqvbZ6ytpeDgzmlNsWYLeAx4DILV3NQNWbsJn2BPc98Cjwd4CNAhHUYTtqJb1mJmrWt+LNjQRY5KZzwIwItwT3YbMDN+qf4nN6PkHb3p7CKWL3TuzqLPhfAb4CIkuX4GyvieAFrgE9kkLqli0F+ufA3MhvkoZsvw2EEBlUt6TBfLpYlzJ8Bvcx8CbwUCL5VdIzLVPd2/2RZCO5hoUyURXeSlD/AQH1XSldZJPZ3pgUCrhKG5WUJdaW+Gz/DjxV0HksQX2btRWVpG7gi/RaI7PHyuJUMJlg14HHU1yHUpslfZMHrlbEn44TRKpnEROrJxlsANgJrIoSJykKe5nVPSjajto46WCSop5WtQ5YSJML/oGOYo3kj45ijaiU9+ko1lGsSIFO5m+jVv4DzGn000Cl+rYfAOIKF6eKScn8Q7k7ZNzErzYb9Ml/AbAy/e+XFMertop4fFfobRGmWrctkk61CxbfLD6Jw1y6WrXDeAP4SFJ2uW5dsXYo2ulb9zzWzuDt9J2yYHcBbbCKnGsh2/cAAAAASUVORK5CYII=) no-repeat 50%;
    background-size: 100%;
    margin-right: 0.32rem;
  }

  .kf {
    width: 0.51rem;
    height: 0.51rem;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACYAAAAmCAYAAACoPemuAAAAAXNSR0IArs4c6QAAAu5JREFUWEftmEuoTVEYx39/eUV5D7wSg2siRVIGDBkw9SgXIxGXTJCBK+8UImXgnetVbsrESEbIM2Rgooi8yrPLQLg+fcfet3W3vc89+5xzX7lrcur0rW/91v+/vm+vvUUXHeqiXPSA5XWmeyhmZmOBncA8YETeXZYZ/wG4AmyW9CrO0aKYmY0B7gKjy1yg0mlvgemSXnuiEKwBWBpkfwq8qHS1NuaPAyYGMWckLUuCfQKGBkHfgHWSTrYHnJktAI4Dg4L8nyUNS4JZBkAjsELSl2oAmlk/YB+wJi2fpIKLoZUx2H3ggcMEE18CSyRdrwTOzGqAi8CUII+rNhWYVgAqAnZD0qxI6qPAkChJM7Ab2C7pV17AFOu+AqsknTMz3/DMksA8yMwmAOeBGQHILaBW0vNS4MysP7A3Yd0jYKEkLzBfJx9YNKkPsAPYAPSKYJqA1b7bYnAZ1h0G1kv6Hs8tCyyYPAc4DYwMYM4CdZIctNVIsc6Lx4vIiykZm1+xMIOZOZT3u9nB/8+AxZLuRAq7dftd0SDGC8qtS7XfzHyDtcA7SaOyqrJw+LMsMjO3c2Nkb+8ozothK3AJuBBUnVf6QWCTpB9FcnqBLQeuSXpYFlhgrReEQ4wPFvwdnMOPvpiky6UUSTImrY8VVSxhre/0GDA/kfg2sEiS97+yRkVggXorI8s83wGgPq3XmVlfYA8wOYX2J3AqLo6qgEWHfiDQHLaBlOqbG11xslRskjS4ojNWjj9m5ote9etNynw/nyckFR6FVVOsHNBic/4fMDObBHiTzTu85z2Jz2hVFTOzLcC2vERB/E1Jf28ZQcnH97GS+1hK1R0C1lYA9kaSv3tUHWxAdMEMH/Slcnofa5T0OAusRc5SM7ZHXGhl/DLivzWS/LfTRtbr23vAJc16QWkPYL+6N0jyG3OrM+aH7h5QuA910vj3keQg0SeCXdEnguEdDOeKHZFU10qxDoZoc7nu8bWnzW10YECPYnnF/gMpGUo2PhT3BQAAAABJRU5ErkJggg==) no-repeat 50%;
    background-size: 100%;
  }
}

.user_page {
  background-color: #fff;
  font-size: 14px;